我正在使用其他帖子的数据和dimple.js脚本:
如果您在该帖子中使用原始未被攻击的数据,您如何以不同方式为利润和收入着色,也就是说,如何为y1和y3使用两种不同的颜色?纯粹的哲学似乎是酒窝不支持这一点。
答案 0 :(得分:5)
由于引入了复合轴,因此较新版本的凹坑不需要重新构建数据。现在可以这样实现:
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}
]
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.bar, [x,y2]);
chart.addSeries("Sales Revenue", dimple.plot.line, [x,y1]);
chart.addSeries("Gross Profit", dimple.plot.bubble, [x,y3]);
chart.assignColor("Sales Units", "white", "red", 0.5);
chart.assignColor("Sales Revenue", "#FF00FF");
chart.assignColor("Gross Profit", "green");
x.dateParseFormat = "%m/%Y";
x.addOrderRule("Date");
chart.draw();
http://jsbin.com/mafegu/2/edit?js,output
正如您所看到的,我已根据您的问题为系列分配了一些颜色。第一个参数是系列颜色标识符(在这种情况下是应用于每个系列的标签),第二个是填充,第三个是笔划,第四个是不透明度。
这里唯一的问题是用于线条的标签(以及用于为系列着色的键)本身不能是数据中的维度名称(否则酒窝会尝试按其值分解)。如有必要,尾随空间可以区分它们。
编辑:我把错误的链接放在中