动态创建和链接dc.js图表
我正在编写一个Web应用程序，允许用户使用dc.js动态创建一个或多个图表。 用户可以指定一些过滤器参数，并且每次检索得到的JSON并将其加载到新的dc.js条形图中。
我想要的是所有的图表都需要链接，所以如果他们在图表上过滤，它们在其他图表上也是如此，如果他们在图表上缩放/滚动，这也会发生在其他图表上。 它们在x轴（日期）上共享相同的数据范围。 我的理解是，这正是dc.js的用途。
我有一个单一的数据数组，所有的数据被加载到（所以如果他们添加另一个图表，数据被添加到现有的数组），并且我有crossfilter对象指向这个。 我知道crossfilter不支持更新数据，所以每次更改数组时，我都会重新创建crossfilter对象。 所有图表都使用相同的维度和比例对象，这些对象也是在新数据上重新创建的。
数据数组添加了两组数据，如下所示：
[
{dd: [Date object], date: "2015-09-14", count-1: 5, count-2: 23},
{dd: [Date object], date: "2015-09-15", count-1: 3, count-2: 6},
{dd: [Date object], date: "2015-09-16", count-1: 8, count-2: 34}
]
我的重载功能如下所示：
function reloadData(){
cf = crossfilter(allData);
dimension = cf.dimension(function(d) { return d.dd } );
scale = d3.time.scale().domain([allData[0].dd, allData[data.length - 1].dd]);
}
我创建图表如下：
var chart = dc.barChart(id);
d3.json(url, function(error, json){
//Load JSON into array here
reloadData();
var group = dimension.group().reduceSum(function(d) { return +d["count-"+id]; } );
chart
.dimension(dimension)
.group(group)
.x(scale)
.xUnits(d3.time.days)
.elasticY(true)
.brushOn(true)
.title(function(d) { return d.data.value; })
.centerBar(true)
.width(1140);
chart.render();
dc.redrawAll();
});
我的代码不幸处于脱机系统中，因此整个页面不容易共享。 任何人都可以建议我可能会失踪，但？
它看起来像你所有的图表都基于一个维度。 Crossfilter过滤器应用于某个维度，不适用于与过滤器尺寸相同的组。 因此，应用过滤器时，在同一维上定义的统计图不会更改。 我建议你为每个图表定义新的尺寸。
链接地址: http://www.djcxy.com/p/32737.html