dc.js testing stacks
by northside45
HTML
<script src="https://rawgithub.com/mbostock/d3/master/d3.js"></script>
<script src="https://rawgithub.com/mtraynham/crossfilter/master/crossfilter.js"></script>
<link rel="stylesheet" href="https://rawgithub.com/dc-js/dc.js/master/dc.css">
<script src="https://rawgithub.com/dc-js/dc.js/master/dc.js"></script>
<div id=dc-pie-type-chart class="dc-chart"/>
<div id=dc-barchart class="dc-chart"></>
JavaScript
var pietypeChart = dc.pieChart("#dc-pie-type-chart");
var barChart = dc.barChart("#dc-barchart");
var data = [
{date: "2013-09-15", amount: 10, amount2: 4,type: "A",activity: "run",person:"Steve"},
{date: "2013-11-25", amount: 10,amount2:8, type: "B" ,activity: "run",person:"Robert"},
{date: "2014-01-12", amount: 100,amount2: 50, type: "A",activity: "run",person:"Robert" },
{date: "2014-02-15", amount: 100,amount2: 3, type: "A",activity: "run" ,person:"Steve"},
{date: "2014-08-15", amount: 11,amount2: 2, type: "A",activity: "run",person:"Steve" },
{date: "2014-08-15", amount: 5,amount2: 6, type: "A",activity: "run",person:"Steve" },
{date: "2014-08-15", amount: 10 ,amount2: 1, type: "A",activity: "walk",person:"Steve"},
{date: "2014-08-15", amount: 2,amount2: 10, type: "A",activity: "run" ,person:"Steve"},
{date: "2014-08-15", amount: 0,amount2: 3, type: "A",activity: "run" ,person:"Philip"},
];
var dtgFormat = d3.time.format("%Y-%m-%d");
data.forEach(function (d) {
d.dtg1 = dtgFormat.parse(d.date);
d.date = +d.date;
d.amount = +d.amount;
d.type = d.type;
d.activity = d.activity;
d.person = d.person;
});
var ndx = crossfilter(data);
var typeDim = ndx.dimension(function (d) {return d.type;});
var typeDimGroup = typeDim.group();
var personDim = ndx.dimension(function (d) {return d.person;});
var personDimGroup = personDim.group().reduceSum(function (d) { return d.amount; });
var personDimGroup2 = personDim.group().reduceSum(function(d) {return d.amount2;});
var personDimGroup_filtered_group = remove_empty_bins(personDimGroup);
var personDimGroup2_filtered_group = remove_empty_bins(personDimGroup2);
barChart
.width(500)
.height(250)
.dimension(personDim)
.group(personDimGroup_filtered_group)
.stack(personDimGroup2_filtered_group)
.elasticY(true)
.elasticX(true)
.xUnits(dc.units.ordinal)
.x(d3.scale.ordinal());
pietypeChart
.height(300)
...