支払いの例crossfilter(https://github.com/square/crossfilter/wiki/API-Reference)から、各支払いタイプ(タブ、ビザ、現金)ごとに1つの折れ線グラフを持つコンポジットチャートを作成するにはどうすればよいですか?Crossfilterの複合グラフの例
9
A
答えて
1
お支払い毎にtotals
(date
ディメンション)のお支払いをtype
として表示することを前提としています。
var payments = crossfilter([...]);
var dateDimension = payments.dimension(function(d) { return new Date(d.date); });
複合グラフを定義し、複合グラフの一部として3つの折れ線グラフを定義するためにグループを使用
var totalForType = function(type) {
return function(d) {
return d.type === type ? d.total : null;
};
};
var tabTotalsGroup = dateDimension.group().reduceSum(totalForType('tab'));
var visaTotalsGroup = dateDimension.group().reduceSum(totalForType('visa'));
var cashTotalsGroup = dateDimension.group().reduceSum(totalForType('cash'));
(タブ、ビザ、現金)各支払タイプについて、支払合計のグループを作成します。 。
var compositeChart = dc.compositeChart('#composite-chart');
compositeChart
...
.x(d3.time.scale().domain([new Date("2011-11-14T16:15:00Z"), new Date("2011-11-14T17:45:00Z")]))
.dimension(dateDimension)
.compose([
dc.lineChart(compositeChart).group(tabTotalsGroup, 'tab').colors(['#ffaa00']),
dc.lineChart(compositeChart).group(visaTotalsGroup, 'visa').colors(['#aa00ff']),
dc.lineChart(compositeChart).group(cashTotalsGroup, 'cash').colors(['#00aaff'])
]);
dc.renderAll();
+0
優秀、ありがとうございます。私はそれをこの文脈でもう少し意味をなさない棒グラフに変更しました。これを出発点として、実際に達成しようとしていたものに適応させることができました。 –
関連する問題
- 1. DC.js + Crossfilterは私がcrossfilterでシンプルDC.js棒グラフを持って手動フィルタ
- 2. crossfilter、d3.brushとnvd3統合
- 3. 複数の棒グラフの凡例
- 4. crossfilterは、次元
- 5. Crossfilter reductioポストキャップ
- 6. SceneJSグラフの例
- 7. D3グラフの例
- 8. Python:Matplotlib Subplotの複合凡例
- 9. 複合型のマーシャリング例外
- 10. Crossfilter行チャートカウント機能
- 11. d3.histogram - 再ビンCrossfilter
- 12. Crossfilter with DC.js Choropleth map
- 13. JasperReport円グラフの例
- 14. div内の複数の画像の変更(グラフの凡例)
- 15. 棒グラフと線グラフの凡例構成
- 16. 複数の凡例からmatplotlibの円グラフまで?
- 17. ChartJS、複数のグラフの凡例をマージする
- 18. FacebookのグラフURLの例
- 19. Google Charts:列と折れ線グラフを持つ複合グラフ
- 20. d3グラフの凡例が重複しています
- 21. 重複ID例外複合コンポーネントと
- 22. STSとSpringの統合複数のxmlファイルと統合された統合グラフ
- 23. TensorFlowグラフ内レプリケーションの例
- 24. Matlab棒グラフの凡例
- 25. DC.js、crossfilter - (削減ランニング)groupAll上の()
- 26. 例外CallbackOnCollectedDelegate tensorflowグラフ
- 27. AmChartsグラフの凡例に最後の値を追加するグラフ
- 28. Googleの円グラフの凡例ナビゲーションアイコンの色
- 29. MPAndroidChartに複数の折れ線グラフがある場合
- 30. dc.js/Crossfilter - ディメンションの平均値を持つ順序棒グラフを作成しますか?
+1。私は合成チャートを使ってそれを作成する方法を失っています。これはシリーズチャートを使って行うことができると思います。しかし、私は専門家の助言を待つことになる –
現時点では、私が本当に望むのは、2つの系列をチャート化し、異なるYを持つ2つのデータセットを比較できるように.useRightYAxis(true)を使用するためです。軸の値。 –