子元素上的Crossfilter DC.JS图表

时间:2018-11-17 04:13:07

标签: d3.js dc.js crossfilter

以下是示例数据:

var payments = crossfilter([
      {date: "2011-11-14T16:17:54Z", quantity: 2, total: 190, tip: 100, type: "tab", productIDs:["001"], coupons:["coupon 1"]},
      {date: "2011-11-14T16:20:19Z", quantity: 2, total: 190, tip: 100, type: "tab", productIDs:["001", "005"], coupons:["coupon 1"]},
      {date: "2011-11-14T16:28:54Z", quantity: 1, total: 300, tip: 200, type: "visa", productIDs:["004" ,"005"], coupons:["coupon 2"]},
      {date: "2011-11-14T16:30:43Z", quantity: 2, total: 90, tip: 0, type: "tab", productIDs:["001", "002"], coupons:["coupon 1", "coupon 2"]},
      {date: "2011-11-14T16:48:46Z", quantity: 2, total: 90, tip: 0, type: "tab", productIDs:["005"], coupons:["coupon 1"]},
      {date: "2011-11-14T16:53:41Z", quantity: 2, total: 90, tip: 0, type: "tab", productIDs:["001", "004" ,"005"], coupons:["coupon 1", "coupon 2"]},
      {date: "2011-11-14T16:54:06Z", quantity: 1, total: 100, tip: 0, type: "cash", productIDs:["001", "002", "003", "004" ,"005"], coupons:["coupon 2"]},
      {date: "2011-11-14T16:58:03Z", quantity: 2, total: 90, tip: 0, type: "tab", productIDs:["001"], coupons:["coupon 1", "coupon 2"]},
      {date: "2011-11-14T17:07:21Z", quantity: 2, total: 90, tip: 0, type: "tab", productIDs:["004" ,"005"], coupons:["coupon 1", "coupon 2"]},
      {date: "2011-11-14T17:22:59Z", quantity: 2, total: 90, tip: 0, type: "tab", productIDs:["001", "002", "004" ,"005"], coupons:["coupon 1", "coupon 2"]},
      {date: "2011-11-14T17:25:45Z", quantity: 2, total: 200, tip: 0, type: "cash", productIDs:["002"], coupons:["coupon 1", "coupon 2"]},
      {date: "2011-11-14T17:29:52Z", quantity: 1, total: 200, tip: 100, type: "visa", productIDs:["004"], coupons:["coupon 1", "coupon 2"]}
]);

我想要两个条形图,一个通过ProduceIDs,另一个通过Coupons,因此该图表将基于汇总数据,例如

ProductID    Total
001          5
002          6
003          4
004          8

Coupon       Total
coupon 1     2
coupon 2     5

还可以单击Product Pie中的一个切片并更新Coupon pie。

我找不到任何能让我做到这一点的例子。

非常感谢您的帮助!

0 个答案:

没有答案