Question

我试图使用dimple.js's3.stacked = false切换来抑制给定月份的数据聚合，但它不会这样做。如何在dimple.js中正确进行聚合抑制？下面的代码不应该累计2013年5月的利润，至少这是我想要实现的目标。

我尝试在s3 = chart.addSeries("Profit in each unit", dimple.plot.bubble, [x,y3]);中使用“Profit”而不是“每个单位的利润”，然后没有聚合，但是气泡改变了s3系列的颜色。如何在“每个单位的利润”泡沫中实现一种颜色并且没有聚合？

此外，是否可以为每个系列使用不同的符号，如方形，钻石等，除了气泡？

var svg = dimple.newSvg("body", 800, 400);

var data = [
  {"Month":"01/2013", "Revenue":2000, "Profit":2000, "Units":4},
  {"Month":"02/2013", "Revenue":3201, "Profit":2000, "Units":3},
  {"Month":"03/2013", "Revenue":1940, "Profit":14000, "Units":5},
  {"Month":"04/2013", "Revenue":2500, "Profit":3200, "Units":1},
  {"Month":"05/2013", "Revenue":800, "Profit":1200, "Units":4},
  {"Month":"05/2013", "Revenue":800, "Profit":5300, "Units":4}
];

var chart = new dimple.chart(svg, data);

chart.setBounds(60,20,680,330);

var x = chart.addCategoryAxis("x", "Month");
var y1 = chart.addMeasureAxis("y", "Revenue");
var y2 = chart.addMeasureAxis("y", "Units");
var y3 = chart.addMeasureAxis(y1, "Profit");
chart.addSeries("Sales Units", dimple.plot.bubble, [x,y2]);
chart.addSeries("Sales Revenue", dimple.plot.bubble, [x,y1]);
s3 = chart.addSeries("Profit in each unit", dimple.plot.bubble, [x,y3]);
s3.stacked = false;

chart.assignColor("Sales Units", "white", "red", 0.5);
chart.assignColor("Sales Revenue", "#FF00FF");
chart.assignColor("Profit in each unit", "green");

x.dateParseFormat = "%m/%Y";
x.addOrderRule("Date");

chart.draw();

Answer 1

您接近答案，您需要在addSeries的第一个参数中指定利润，但该参数可以采用数组，并且只有数组的最后一个元素定义颜色，因此您可以在那里包含您的标签：< / p>

DECLARE @tblGroup TABLE (
  id int,
  name varchar(20)
)
INSERT INTO @tblGroup (id, name)
  VALUES (1, 'Room 1'), (2, 'Room 2'), (3, 'Room 3'), (4, 'Room 4')

DECLARE @tblDevice TABLE (
  id int,
  name varchar(20),
  group_id int
)
INSERT INTO @tblDevice (id, name, group_id)
  VALUES (1, 'Computer', 1), (2, 'Camera', 1), (3, 'Computer', 2), (4, 'Switch', 2)

DECLARE @tblStatus TABLE (
  id int,
  device_id int,
  dtStart datetime,
  dtEnd datetime
)
INSERT INTO @tblStatus (id, device_id, dtStart, dtEnd)
  VALUES (1, 1, '2015-05-12 01:40:00.0', '2015-05-12 01:40:20.0'),
  (2, 2, '2015-05-12 01:40:01.0', '2015-05-12 01:40:27.0'),
  (3, 3, '2015-05-12 03:43:03.0', '2015-05-12 03:46:14.0'),
  (4, 4, '2015-05-12 03:43:00.0', '2015-05-12 03:46:12.0'),
  (5, 2, '2015-05-12 07:12:10.0', '2015-05-12 07:12:22.0')

SELECT
  s.id,
  s.device_id,
  g.name AS groupName,
  d.name AS deviceName,
  s.dtStart,
  s.dtEnd
FROM @tblStatus s
INNER JOIN @tblDevice d
  ON d.id = s.device_id
INNER JOIN @tblGroup g
  ON g.id = d.group_id

堆叠属性是关于元素的定位而不是数据集的聚合，因此对此没有帮助。

Dimple不支持其提供的绘图方法的其他形状，但是您可以创建自己的形状并将其提供给addSeries的第二个参数。要制作完整的系列绘图仪，您应该获取气泡图源（https://github.com/PMSI-AlignAlytics/dimple/blob/master/src/objects/plot/bubble.js）的副本并修改它以绘制您喜欢的任何内容。然而，这可能会变得棘手。

如果你不关心某些功能（例如工具提示，动画，重复绘制等），你可以将它们剪掉，并将代码减少到极少。这是绘制明星最基本的绘图仪：

s3 = chart.addSeries(["Profit", "Profit in each unit"], dimple.plot.bubble, [x,y3]);

http://jsbin.com/mafegu/6/edit?js,output

如何在dimple.js中使用series.stack = false来抑制聚合;每个系列的不同符号

1 个答案: