Question

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

下面的代码完成了堆叠工作，但是如图所示，它不是显示所有通道的聚合计数，而只是表示特定扇区中存在通道。

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

当您在类别上创建度量轴时，它会计算该类别的不同值，在您的情况下，每个通道/段当然会有一个不同的通道，这意味着它的值为1.

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

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

所以计数的任何细节都会丢失。

因此，您有两个选择，这两个选项都要求您对数据执行某些操作，除非您已经拥有它们。第一个假设您在我的示例中有一个唯一的列（或者至少对每个频道/片段组合是唯一的），这将是Brand。这意味着您可以将代码更改为：

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

使用Dimple.js聚合分类变量

1 个答案: