Chartjs折线图显示悬停时的旧数据

时间:2019-08-29 20:54:57

标签: javascript charts chart.js

我有一个使用chart.js创建的折线图。在页面加载时一切正常,但是当切换图表并将鼠标悬停在图表的角落时,它将显示旧图表。

这也是您可以查看其行为的实时Web应用程序。 https://www.batchrank.com/

我试图用update()进行修复,销毁并清除它们中没有一个起作用的东西。

非常感谢您的帮助,

这是我的代码;

    var ctx = document.getElementById("chartContainer").getContext("2d");
    var myChart = new Chart(ctx, {
        type: "line",
        data: {
            label: "data",
            datasets: [
                {
                    label: "Mobile Speed Scores",
                    data: mobileData,
                    backgroundColor: ["rgba(255, 99, 132, 0.2)"],
                    borderColor: ["rgba(255, 99, 132, 1)"],
                    borderWidth: 1
                },
                {
                    label: "Desktop Speed Scores",
                    data: desktopData,
                    backgroundColor: ["rgba(49, 67, 129, 0.2)"],
                    borderColor: ["rgba(49, 67, 129, 1)"],
                    borderWidth: 1
                }
            ]
        },
        options: {
            responsive: true,
            title: {
                display: true,
                text: inspectUrl
            },
            scales: {
                xAxes: [
                    {
                        type: "time",
                        display: true,
                        scaleLabel: {
                            display: true,
                            labelString: "Date"
                        }
                    }
                ],
                yAxes: [
                    {
                        scaleLabel: {
                            display: true,
                            labelString: "value"
                        }
                    }
                ]
            }
        }
    });

    myChart.render();
    const removeElements = elms => elms.forEach(el => el.remove());
    removeElements(document.querySelectorAll(".progress"));

    function toogleDataSeries(e) {
        e.dataSeries.visible = !(
            typeof e.dataSeries.visible === "undefined" || e.dataSeries.visible
        );
      myChart.destroy();
        myChart.render();

    }
}

0 个答案:

没有答案