dc.js의 필터 및 트리거 관련 문제 - 다시 그리기가 동기화되지 않았습니다.

Question

줄 플롯과 버블 플롯의 두 가지 플롯이 있습니다. 버블 플롯을 클릭하면 라인 플롯이 업데이트되어 해당 버블과 관련된 데이터 만 그려집니다. 이는 표준 구현과 달리 클릭하면 기존 필터에서 데이터를 추가하거나 제거합니다.

하면 이미지를 보면 당신은 '모델 0'플롯 위험 (그래프 1에서 Y 규모)을 선택하더라도 해당하지 않는 것을 볼 수 있습니다. 나는 '모델 5'를 클릭하면

그리고 지금, 나는 반대를 얻을.

현재 구현은 jsfiddle here으로 게시됩니다. 첨부 된 데이터 테이블에서 내가 원하는 것을 얻고 있음을 알 수 있지만 라인 플롯이 올바르게 다시 그려지지 않습니다. 사실, 새로운 필터가 아닌 필터 필터로 다시 그려진 것 같습니다.

이 구현은 here : 특히 renderlet 및 on("filtered", function (chart) { 행에서 해킹되었습니다. 그러나이 작업을하기 위해 두 번째 플롯에 대해 plot1.filter(chart.filter()); 행을 주석 처리해야했습니다. renderlet및on("filtered" ... 또는 on("postRedraw" ... 청취자가 함께 필요한 이유

난 정말 이해가 안 돼요.

나는이 집을 둘러 보았고, 어떤 제안이라도 매우 감사하게 받아 들여질 것입니다.

Answer 1

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 
      }; 
     }); 

이러한 변경 후에는 코드가 원하는대로 동작합니다.