Charts Dimple.js多系列钢筋未堆叠

下面是示例代码

var svg = dimple.newSvg("#chartContainer", 600, 400),
chart = null,
s1 = null,
s2 = null,
x = null,
y1 = null,
y2 = null,
data = [
    { "ID" : "1", "Value 1" : 100000,  "Value 2" : 110000 },
    { "ID" : "2", "Value 1" : 90000,  "Value 2" : 145000 },
    { "ID" : "3", "Value 1" : 140000,  "Value 2" : 60000 }
];

chart = new dimple.chart(svg, data);
x = chart.addCategoryAxis("x", "ID");
y1 = chart.addMeasureAxis("y", "Value 1");
y2 = chart.addMeasureAxis("y", "Value 2");
s1 = chart.addSeries(null, dimple.plot.bar, [x, y1]);
s2 = chart.addSeries(null, dimple.plot.bar, [x, y2]);
chart.draw();

当我运行时，序列被堆叠起来，基本上我需要将序列一个接一个地显示以便于比较

我是个新手，非常感谢你的帮助

注册

---

Vikram认为数据格式不适合dimple。当前图表未堆叠，条形图实际上彼此重叠。要简单地在酒窝中工作，您需要以下格式的数据：

data = [
    { "ID" : "1", "Measure" : "Value 1", "Value" : 100000 },
    { "ID" : "2", "Measure" : "Value 1", "Value" : 90000 },
    { "ID" : "3", "Measure" : "Value 1", "Value" : 140000 }
    { "ID" : "1", "Measure" : "Value 2", "Value" : 110000 },
    { "ID" : "2", "Measure" : "Value 2", "Value" : 145000 },
    { "ID" : "3", "Measure" : "Value 2", "Value" : 60000 }
];

然后，要正确堆叠钢筋，可以执行以下操作：

chart = new dimple.chart(svg, data);
chart.addCategoryAxis("x", "ID");
chart.addMeasureAxis("y", "Value");
chart.addSeries("Measure", dimple.plot.bar);
chart.draw();

要以分组栏的形式执行此操作，可以按如下方式执行：

chart = new dimple.chart(svg, data);
chart.addCategoryAxis("x", ["Measure", "ID"]);
chart.addMeasureAxis("y", "Value");
chart.addSeries("Measure", dimple.plot.bar);
chart.draw();

---

在本例中，实际上是在不同的y轴上绘制度量值。我担心在单独的轴上进行分组是很棘手的，但是这里显示了一种稍微有点粗糙的方法：

最简单的方法是使用另一个函数“分解”服务器返回的数据，假设这对您来说是有效的。因为图表数据只是原始的Javascript对象，所以这非常简单和轻松

例如：

  var explodeData = function (oldData) {
    var newData = [];
    foreach(row in oldData) {
      newData.push({ID: row["ID"], MeasureType: "Value 1", Value: row["Value 1"]});
      newData.push({ID: row["ID"], MeasureType: "Value 2", Value: row["Value 2"]});
    }
    return newData;
  };

  d3.csv("/data", function (rawData) {
    var data = explodeData(rawData);
    var myChart = new dimple.chart(svg, data);
    ...
  });

---

希望有帮助！不管怎样，我就是这么做的

谢谢约翰。。。我将尝试Hi John，基本上我是在并排比较两个参数。例如，对于一年，我需要按月并排显示每个月的销售额与购买价值。