画布已空但重新出现 [英] Canvas Emptied but Reappears

问题描述

我已经看到了有关此问题的几种解决方案，但尚未找到适合我的情况的解决方案。
我有一个使用 chart.js 制作的图表，该图表使用 canvas 显示。我有一个应该清除 canvas 的函数，以便随后可以使用不同的x变量重绘该图表。该功能最初有效，但是一旦我开始将鼠标悬停在已清理的画布上，旧内容就会重新出现。更具体地说，如果我将鼠标悬停在以前的数据点上，它似乎会重新出现。

I have seen several solutions on this issue but have not found one yet that works for my situation. I have a chart being made with chart.js which uses canvas to display. I have a function that is supposed to clear the canvas so that I can then redraw the chart with different x variables. The function works initially but as soon as I start to hover on my cleared canvas the old contents reappear. More specifically it seems to reappear if I am hovering over on of the previous data points.

这里是函数：

function empty(){
    canvas = document.getElementById("loansChart");
    const context = canvas.getContext('2d');
    context.clearRect(0, 0, canvas.width, canvas.height);
}

编辑

如果画布包含具有悬停启动功能项的项目，那么这些项目在画布中是否仍然存在（只是不可见）？

If a canvas contained items that had hover initiated function items, do those items still exist (just invisible) in the canvas?

推荐答案

您应该使用chart.js函数来更新和清除图表，而不是用于html画布的图表。
这些文档非常简单。 https://www.chartjs.org/docs/latest/developers/updates。 html

You should use the chart.js functions for updating and clearing charts rather than the ones for the html canvas. The docs are quite straightforward. https://www.chartjs.org/docs/latest/developers/updates.html

这篇关于画布已空但重新出现的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！