我使用chart.js 3.x版实现了下面的图表。
https://jsfiddle.net/Lxya0u98/12/
我的图表中有多个数据集以实现所需的行为。
我遇到了数据集重叠的问题。在图表中，blue color line的末端与green color dot数据集重叠。是否有方法可以避免此问题？
我有以下两个数据集：
// Data set for the Big Dot
{
showLine: false,
borderWidth: 0,
lineTension: 0,
borderColor: colorVal,
backgroundColor: colorVal,
pointBackgroundColor: colorVal,
pointBorderColor: colorVal,
pointBorderWidth: 2,
pointRadius: 15,
};
// Data set for the Connecting Lines
{
showLine: true,
lineTension: 0,
borderWidth: 5,
borderColor: colorVal,
pointRadius: 0,
pointBorderWidth: 0,
spanGaps: true,
};数据集是否有Z索引，以便它们显示在堆栈中前一个数据集的顶部？
2条答案
按热度按时间l0oc07j21#
选项
dataset.order与z-index具有类似的效果。order值较大的数据集因此，将
order: 1添加到线数据集应该可以解决此问题。l7wslrjt2#
您可以不定义多个数据集，而按以下步骤进行：
beforeDraw挂钩在数据点之间绘制不同颜色的连接线，并将其连接到图表的开放端。请注意，您必须定义
xAxes.ticks.max，以获得图表右侧的开口端线。请看下面的可运行代码片段，看看它是如何工作的。
第一个