Water level averages
by JP Obley
HTML
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
<script type="text/javascript" src="https://rawgit.com/jpobley/datasciencecoursera/master/avgs.js"></script>
<script type="text/javascript" src="https://rawgit.com/jpobley/datasciencecoursera/master/days.js"></script>
<script type="text/javascript" src="https://rawgit.com/masayuki0812/c3/master/c3.js">
</script>
<link rel="stylesheet" type="text/css" href="https://rawgit.com/masayuki0812/c3/master/c3.css">
<div id="chart"></div>
JavaScript
var years = Object.keys(data);
var x = ["x"].concat(days);
var columns = [x];
console.log(x);
years.forEach(function (year) {
var yearData = data[year];
var column = [year];
yearData.forEach(function (arr) {
column.push(arr[1]);
});
columns.push(column);
});
var chart = c3.generate({
size: {
height:500
},
legend: {
show: false
},
point: {
show: false
},
data: {
type: "area-spline",
x: "x",
xFormat: "%m-%d",
columns: columns,
},
axis: {
x: {
type: 'timeseries',
tick: {
format: "%b",
values: ["01-01", "02-01", "03-01", "04-01", "05-01", "06-01", "07-01", "08-01", "09-01", "10-01", "11-01", "12-01"]
}
}
},
color: {
pattern: ["rgb(23, 190, 207)"]
}
});