javascript - 使用 Dimple.js 聚合分类变量

Question

我正在尝试使用 Dimple.js 和 D3 创建基于两个非数字变量的堆积条形图。数据集包含大约 50,000 个点，每个点按两种方式分类(扇区和 channel )。理想情况下，x 轴是一系列类别( channel )，而 y 轴表示这些相同类别的计数。我希望根据第二系列类别(部门)来堆叠条形图。

下面的代码执行堆叠工作，但如图所示，它不是显示所有 channel 的聚合计数，而是仅指示特定扇区中存在 channel 。

var myChart = new dimple.chart(svg, data);
      var x = myChart.addCategoryAxis("x", "channel"); 
      myChart.addMeasureAxis("y","channel");
      myChart.addSeries("channel", dimple.plot.bar);
      myChart.draw();

图片:https://scontent-lga1-1.xx.fbcdn.net/hphotos-xpt1/t31.0-8/11223612_10207362634082002_162421922019209911_o.jpg

有没有办法使用 Dimple 来进行聚合？在文档中似乎找不到它。有人愿意帮忙/有处理这个问题的经验吗？

非常感谢!

Answer 1

您的代码示例中有一个拼写错误，但这不是这里的问题。为了让将来阅读此答案的任何人都清楚，它应该阅读(否则我的答案就没有意义!):

myChart.addSeries("segment", dimple.plot.bar);

当您在某个类别上创建度量轴时，它会计算该类别的不同值，在您的情况下，每个 channel /分割当然都会有一个不同的 channel ，这意味着它的值为 1。

您在这里面临的问题是，Dimple 在执行其他操作之前会将您的数据聚合到代码中定义的最小粒度级别(在本例中为 channel /段)。这意味着像这样的数据集:

channel      segment    brand      sales
----------------------------------------
Ecommerce    Sports     Nike        2000
Ecommerce    Sports     Reebok      3000
Ecommerce    Sports     Adidas      4000
Retail       Sports     Nike        5000
Retail       Sports     Reebok      6000
Retail       Sports     Adidas      7000
Retail       Sports     Puma        8000

会变成:

channel      segment
--------------------
E-commerce   Sports
Retail       Sports

因此任何计数细节都会丢失。

因此，您有 2 个选择，这两个选择都要求您对数据执行某些操作，除非您已经拥有它们。第一个假设在我的示例中您有一个唯一的列(或者至少对于每个 channel /分割组合来说是唯一的)，即品牌。这意味着您可以将代码更改为:

var myChart = new dimple.chart(svg, data);
var x = myChart.addCategoryAxis("x", "channel"); 
myChart.addMeasureAxis("y","brand");
myChart.addSeries("segment", dimple.plot.bar);
myChart.draw();

您的数据现在将分组为:

channel      segment      dist brands
-------------------------------------
Ecommerce    Sports                 3
Retail       Sports                 4

另一种方法是向数据中添加一列 1:

channel      segment    brand      sales     count
--------------------------------------------------
Ecommerce    Sports     Nike        2000         1
Ecommerce    Sports     Reebok      3000         1
Ecommerce    Sports     Adidas      4000         1
Retail       Sports     Nike        5000         1
Retail       Sports     Reebok      6000         1
Retail       Sports     Adidas      7000         1
Retail       Sports     Puma        8000         1

与任何其他数字列一样求和:

var myChart = new dimple.chart(svg, data);
var x = myChart.addCategoryAxis("x", "channel"); 
myChart.addMeasureAxis("y","count");
myChart.addSeries("segment", dimple.plot.bar);
myChart.draw();

给出相同的结果

channel      segment      sum of count
--------------------------------------
Ecommerce    Sports                  3
Retail       Sports                  4