Skip to content

Instantly share code, notes, and snippets.

@ryanvgates
Last active August 29, 2015 14:21
Show Gist options
  • Save ryanvgates/c172ace0d60758d8e97b to your computer and use it in GitHub Desktop.
Save ryanvgates/c172ace0d60758d8e97b to your computer and use it in GitHub Desktop.
Step 7 - Styling
#graphdivlegend {
float: right;
}
#graphdiv {
float: left;
}
#graphdivlegend > span {
display: block;
}
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<link href="index.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/dygraph/1.1.0/dygraph-combined-dev.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/numeral.js/1.4.5/numeral.min.js"></script>
</head>
<body>
<div id="graphdiv"></div>
<div id="graphdivlegend"></div>
<script src="index.js"></script>
</body>
</html>
g = new Dygraph(
// containing div
document.getElementById("graphdiv"),
// CSV or path to a CSV file.
"Fort Lauderdale Data Snapshot-Reoriented.csv",
{
title: 'Fort Lauderdale Budget Data',
width: 800,
height: 480,
axisLabelWidth: 100,
labelsDiv: "graphdivlegend",
axes: {
y: {
axisLabelFormatter: formatLikeCurrency,
valueFormatter: formatLikeCurrency,
}
},
}
);
function formatLikeCurrency(x) {
return numeral(x).format('($ 0.00 a)');
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment