汇总分类变量w/ Dimple.js

Aggregating Categorical Variables w/ Dimple.js

本文关键字:Dimple js 类变量      更新时间:2023-09-26

我试图使用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

是否有一种方法使用酒窝做这个聚合?在文件里好像找不到。有人愿意帮忙/有经验的处理这个问题吗?

非常感谢!

您的代码示例中有一个错别字,这不是这里的问题。为了让将来读到这个答案的人清楚,它应该是这样的(否则我的答案就没有意义了!):

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

当你在一个类别上创建一个测量轴时,它会计算该类别的不同值,在你的情况下,每个通道/段当然会有一个单独的通道,这意味着它的值为1。

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

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

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

因此,您有两种选择,这两种选择都要求您对您的数据做一些事情,除非您已经有可用的数据。第一个假设您有一个唯一的列(或者至少对于每个Channel/Segment组合来说是唯一的),在我的例子中就是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