Charts Flot:堆叠折线图错误-点重叠

Charts Flot:堆叠折线图错误-点重叠,charts,flot,stacked-area-chart,Charts,Flot,Stacked Area Chart,创建面积图(折线图为堆栈+填充)时,点与填充颜色重叠 我创建了一个示例来演示此错误: Flot图表选项: var options = { series: { stack: true }, lines: { fill: 1, show: true }, points: { show: true } }; 有什么可能的解决方法?看起来像是flot如何使用堆栈插件填充的一个bug。在不深入源代码的情况下,我能想到的唯一快速修复方法是将数

创建面积图(折线图为堆栈+填充)时,点与填充颜色重叠

我创建了一个示例来演示此错误:

Flot图表选项:

var options = {
    series: { stack: true },
    lines: {
        fill: 1,
        show: true
    },
    points: { show: true }
};

有什么可能的解决方法?

看起来像是flot如何使用堆栈插件填充的一个bug。在不深入源代码的情况下,我能想到的唯一快速修复方法是将数据复制到每组数据的两个系列中。第一个绘制线条和填充,第二个仅绘制顶部的点:

someData = [[1, 3],
            [2, 16],
            [3, 3],
            [4, 3],
            [5, 8],
            [6, 12],
            [7, 3]];

var dataset = [
    {color: "#edc240", data: someData, stack: 1, lines: {fill: 1, show: true}, points: {show: false}}, 
    {color: "#afd8f8", data: someData, stack: 1, lines: {fill: 1, show: true}, points: {show: false}},
    {color: "#cb4b4b", data: someData, stack: 1, lines: {fill: 1, show: true}, points: {show: false}},
    {color: "#4da74d", data: someData, stack: 1, lines: {fill: 1, show: true}, points: {show: false}},
    {color: "#edc240", data: someData, stack: 2, lines: {show: false}, points: {show: true}}, 
    {color: "#afd8f8", data: someData, stack: 2, lines: {show: false}, points: {show: true}},
    {color: "#cb4b4b", data: someData, stack: 2, lines: {show: false}, points: {show: true}},
    {color: "#4da74d", data: someData, stack: 2, lines: {show: false}, points: {show: true}}
];

$.plot("#flot", dataset, {});
小提琴

产生:


谢谢您的回答!目前看来,这是最合理的方法。