2016-12-23 12 views
1

dc.jsを使用して2つの異なるチャートを異なるデータセットで接続しようとしています。dc.jsは2つの異なるデータセットでチャートを作成し、1つは他のチャートを更新する

最初のドーナツチャートは折れ線グラフのフィルタとして機能するはずですが、2つの間の接続を取得する方法が見つかりませんでした。

これらのデータセットを結合したくない場合があり、結合があまり意味をなさないため、私はこれらのデータセットに参加したくないと思います。

は、私が選択した項目をキャッチし、あなたは正しい考えを持っている http://jsfiddle.net/yccu/qBr7y/32/

答えて

1

折れ線グラフ

sobRingChart.on('filtered', function(chart) { 
    PUchart.filter(null) 
    .filter(chart.filters()); 
    dc.redrawAll() 
}); 

例でそれらをフィルタリングすることを試みた、それだけでデータの不一致です。

重要なことは、クロスフィルタでのすべてのフィルタ処理がディメンションオブジェクトを介して行われることです。フィルタリングする値は、フィルタリングするディメンションと互換性がある必要があります。

したがって、折れ線グラフは時間ベースであるため、Sourceでフィルタリングすることはできません。あなたはそれを行うために別の次元を設定する必要があります:

var sourceDim2 = spendData2.dimension(function(d) { return d.Source; }) 

そして、代わりに折れ線グラフで、そのディメンションにフィルタを適用:それは複数の値に対してフィルタリング処理する必要があるため

sobRingChart.on('filtered', function(chart) { 
    if(chart.filters().length) 
    sourceDim2.filterFunction(function(k) { 
     return chart.filters().indexOf(k) !== -1; 
    }); 
    else sourceDim2.filter(null); 
    dc.redrawAll() 
}); 

これが唯一の複雑です(リングチャートのスライスが複数選択されている場合)。 Crossfilterは単純ではありません。それはおそらくすべて効率的ではないからです。 (通常は重要ではありません)

フィルタがあるかどうかを確認する必要があります。存在する場合は、現在考慮されているキーがchart.filters()にあるかどうかを調べるフィルタ関数を設定します。そうでない場合は、.filter(null)に電話してフィルタをクリアします。

+0

私は週末のゴードンを保存しました!ワーキングリンクhttp://jsfiddle.net/yccu/qBr7y/33/ – YCuvelie

関連する問題