Динамическое создание и привязка dc.js Диаграммы

Question

Я пишу веб-приложение, которое позволяет пользователям динамически создавать одну или несколько диаграмм с использованием 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(); 
}); 

Мой код, к сожалению, находится в автономном режиме, поэтому вся страница не так-то просто поделиться. Может ли кто-нибудь предположить, что я могу потерять?

Answer 1

Похоже, что все ваши диаграммы основаны на одном измерении. Фильтры Crossfilter наносятся на размер и делают не применяются к группам с тем же размером, что и фильтр. Поэтому диаграммы, определенные в одном измерении, не будут меняться при применении фильтров. Я бы рекомендовал вам определить новые измерения для каждой диаграммы.