Устранение неполадок с фильтрами и триггерами в dc.js - перерисовывание не синхронизировано

Question

У меня есть два участка: линейный участок и участок пузыря. Когда я нажимаю на участок пузырька, я хочу, чтобы график линии обновлялся, чтобы он рисовался только с данными, связанными с этим «пузырем». Это отличается от стандартной реализации, при которой щелчок будет добавлять или удалять данные из существующего фильтра.

Если вы посмотрите на изображение вы можете увидеть, что, хотя «модель 0» выбрана проложенным опасность (у-шкалы в участке 1) не соответствует.

И теперь, когда я нажимаю на 'модели 5', я наоборот.

Моя текущая реализация опубликована как jsfiddle here. Из прилагаемой таблицы данных видно, что я достигаю того, чего хочу, но график линии не перерисовывается правильно. На самом деле, кажется, повторить с последним фильтром, а не новым.

Эта реализация взломана с here: в частности, линии renderlet и on("filtered", function (chart) {. Однако, чтобы сделать эту работу, мне пришлось прокомментировать строку plot1.filter(chart.filter()); для второго сюжета.

Я не очень понимаю, почему renderletи в on("filtered" ... или on("postRedraw" ... слушателей необходимо вместе.

Я был вокруг домов на этом, поэтому любые предложения были бы очень благодарны.

Answer 1

Я попытался упростить jsfiddle, чтобы изолировать проблему. Вот адаптированный jsfiddle: http://jsfiddle.net/djmartin_umich/mKz7A/

Ваш объект plot2 keyAccessor получил доступ к значению df из p.value.df, а не к измерению на df. Я предполагаю, что это то, что вызывало проблемы. Вот адаптированный код:

dfDim = ndx.dimension(function (d) {return d.df;}); 
... 
plot2.width(300) 
    .height(250) 
    .dimension(dfDim) 

Я также заметил, что ваш Plot2 valueAccessor и radiusAccessor не использовали вычисленное среднее значение. Ваш код будет переписывать est и estse для каждой записи, добавленной или удаленной из группы. Вот адаптированный код, который вычисляет среднее значение:

dfGroup = dfDim.group().reduce(
     //add 
     function (p, v) { 
      ++p.count; 
      p.est += v.est; 
      p.avg_est = p.est/p.count; 
      p.estse += v.estse; 
      p.avg_estse = p.estse/p.count; 
      return p; 
     }, 
     //remove 
     function (p, v) { 
      --p.count; 
      p.est -= v.est; 
      p.avg_est = p.est/p.count; 
      p.estse -= v.estse; 
      p.avg_estse = p.estse/p.count; 
      return p; 
     }, 
     //init 
     function (p, v) { 
      return { 
       count: 0, 
       est: 0, 
       estse: 0, 
       avg_est: 0, 
       avg_estse: 0 
      }; 
     }); 

После этих изменений, я считаю, что код ведет себя так, как вам хотелось.