Charts 绘制多系列酒窝图折线图时测量轴加总值。如何避免
我正在使用dimple.js库绘制多系列折线图。我面临的问题是,x轴重复值相加并在图形中绘制为单个点。这是我的例子。在下面的数据中,对于240000 KM,有两个值MM-8和14。应将其绘制为两个不同的点。但渲染的图表在(2224000)处只有一个点。第8点和第14点相加。如何解决这个问题。请建议Charts 绘制多系列酒窝图折线图时测量轴加总值。如何避免,charts,line,dimple.js,Charts,Line,Dimple.js,我正在使用dimple.js库绘制多系列折线图。我面临的问题是,x轴重复值相加并在图形中绘制为单个点。这是我的例子。在下面的数据中,对于240000 KM,有两个值MM-8和14。应将其绘制为两个不同的点。但渲染的图表在(2224000)处只有一个点。第8点和第14点相加。如何解决这个问题。请建议 var chartdata = [{ "Tyre": "1-OL", "Design": "HDL2+ECO+", "Size": "
var chartdata = [{
"Tyre": "1-OL",
"Design": "HDL2+ECO+",
"Size": "295.0/22.5R55.0",
"KM": 128000,
"MM": 22
}, {
"Tyre": "1-OL",
"Design": "HDL2+ECO+",
"Size": "295.0/22.5R55.0",
"KM": 145000,
"MM": 20
}, {
"Tyre": "1-OL",
"Design": "HDL2+ECO+",
"Size": "295.0/22.5R55.0",
"KM": 195000,
"MM": 17
}, {
"Tyre": "1-OL",
"Design": "HDL2+ECO+",
"Size": "295.0/22.5R55.0",
"KM": 240000,
"MM": 8
}, {
"Tyre": "1-OL",
"Design": "HDL2+ECO+",
"Size": "295.0/22.5R55.0",
"KM": 240000,
"MM": 14
}, {
"Tyre": "1-OL",
"Design": "HDL2+ECO+",
"Size": "295.0/22.5R55.0",
"KM": 300000,
"MM": 12
}, {
"Tyre": "1-OL",
"Design": "HDL2+ECO+",
"Size": "295.0/22.5R55.0",
"KM": 429117.39,
"MM": 3
}];
var svg = dimple.newSvg("#chartContainer", '100%', '100%');
// Create and Position a Chart
var myChart = new dimple.chart(svg, chartdata);
myChart.setMargins(50, 10, 10, 50);
//myChart.setBounds(30, '0px', '95%', '100%');
var x = myChart.addCategoryAxis("x", "KM");
x.showGridlines = false;
var y = myChart.addMeasureAxis("y", "MM");
y.showGridlines = false;
y.ticks = 5;
// Min price will be green, middle price yellow and max red
//myChart.addColorAxis("KM", ["green", "yellow", "red"]);
// Add a thick line with markers
myChart.addSeries("Tyre", dimple.plot.bubble);
var s = myChart.addSeries("Tyre", dimple.plot.line);
// Add line markers to the line because it looks nice
s.lineMarkers = true;
// Draw the chart
myChart.draw();
谢谢,
GeervaniDimple根据代码中定义的维度预聚合数据。这意味着您需要某种方法来区分数据中的行,否则它们将被聚合。您应该考虑是什么使一行不同于另一行,并在数据中捕获它。例如,我假设它们是观察结果,并对它们进行编号:
for (var i = 0; i < chartdata.length; i += 1) {
chartdata[i]["Observation"] = i;
}
当然,如果您可以包含某种时间值或更有意义的方式来区分一行在现实世界中实际与什么相关,那么这将是更好的选择,但下面是一个示例:关于这方面的任何帮助。好几天来我都被这件事深深打动了
var s = myChart.addSeries(["Observation", "Tyre"], dimple.plot.line);