Skip to content

Instantly share code, notes, and snippets.

@a-mckinley

a-mckinley/.block

Created August 31, 2018 10:01
Show Gist options
  • Save a-mckinley/cbb6a2e96ae6b588642ae0c1ca03060f to your computer and use it in GitHub Desktop.
Save a-mckinley/cbb6a2e96ae6b588642ae0c1ca03060f to your computer and use it in GitHub Desktop.
Download ZIP
fresh block
Raw
.block
license: mit
Raw
data.csv
Task Day
MRA 2018-10-10
MRD 2018-10-10
MRA 2018-10-11
MRA 2018-10-11
MRA 2018-10-13
Raw
index.html
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="https://unpkg.com/dc@3/dc.css" />
<script src="https://unpkg.com/d3@5/dist/d3.js"></script>
<script src="https://unpkg.com/crossfilter2@1.4/crossfilter.js"></script>
<script src="https://unpkg.com/dc@3/dc.js"></script>
<script src="https://rawgit.com/crossfilter/reductio/master/reductio.js"></script>
<script src="https://npmcdn.com/universe@latest/universe.js"></script>
<style>
</style>
</head>
<body>
<div id="test"></div>
<script>
var chart = dc.barChart("#test");
d3.csv("data.csv").then(function(tasks) {
var ndx = crossfilter(tasks),
dayDimension = ndx.dimension(function(d) {return new Date(d.Day);}),
dayGroup = dayDimension.group().reduceCount();
chart
.width(768)
.height(480)
.x(d3.scaleTime().domain([new Date('2018-10-01'),new Date('2018-10-31')]))
.xUnits(d3.timeDays)
//.x(d3.scaleLinear().domain([0,30]))
.brushOn(false)
.yAxisLabel("This is the Y Axis!")
.dimension(dayDimension)
.group(dayGroup);
chart.render();
});
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment