在一个图表中打印两个面积图，而不将它们堆叠在一起

Print two area charts in one diagram without stacking them above each other?

本文关键字：在一起 一个 两个 打印 面积图      更新时间：2023-09-26

我想用dimple.js在一个图中打印两个面积图。我是这样做的:

var svg = dimple.newSvg("#chart", svgWidth, svgHeight);
var chart = new dimple.chart(svg, data);
var xAxis = chart.addCategoryAxis("x", "DayOfMonth");
xAxis.title = null;
xAxis.addOrderRule("Date");
var yAxis = chart.addMeasureAxis("y", "Amount");
yAxis.title = null;
var series = chart.addSeries("Type", dimple.plot.area);
series.interpolation = "cardinal";
chart.draw();
下面是我创建的JSFiddle: http://jsfiddle.net/7LoLLkfp/1/

问题是这两个图表在彼此之上。当您查看DayOfMonth 20的最后一个值。浏览量应该是6点赞应该是4点赞。在我的例子中，点赞数是6 + 4 = 10。

我怎样才能在一个图中正确地画出两个面积图而不把它们堆叠在一起?

集合系列。堆叠为false，例如

var series = chart.addSeries("Type", dimple.plot.area);
series.interpolation = "cardinal";
series.stacked = false;
chart.draw();

如果你想改变顺序设置一个addOrderRule

series.addOrderRule(["Views", "Likes"]);

或

series.addOrderRule(["Likes", "Views"]);

我认为问题是使用堆叠面积图。为了显示该区域，它将一个堆叠在另一个的顶部。您可能最好使用不同的图表类型，例如line

相关文章：