如何在 qml 中擦除最后的 canvas 油漆

Question

Canvas {
    id: canvas
    onPaint: {
        if (personalInfo.count === 0) {
            return
        }
        var ctx = canvas.getContext("2d");
        ctx.globalCompositeOperation = "source-over";
        var points = []
        for (var i = 0; i < personalInfoModel.dataCount(); i++) {
            var temp = personalInfoModel.get(i)
            points.push({
                            date: temp.date,
                            heartRate: temp.heartRate,
                            temprature: temp.temprature,
                            pressure: temp.bloodPressure
                        }
                        )
        }
        drawAxis(ctx)
        drawGridLineAndUnitNum(ctx, chart.activeChart, points, "x", 15); 
    }
}

我有两个按钮。如果按钮 A 被点击，然后将 chart.activeChart 设置为 7 并在 A::onClicked 上调用 cavas.requestPaint()，在 cavas.drawGridLineAndUnitNum 上绘制七条垂直线。如果点击按钮B，除了将chart.activeChart设置为30，都与A::onClicked相同。我希望当点击A时，canvas擦除点击B的产品绘制的线条，反之亦然。但实际上，它总是保留上次绘制的线。

Answer 1

A Context2D，关联到特定的 Canvas，提供两个有用的功能：

在大多数情况下，可以 "clear" 一个 Canvas 只需用背景颜色填充它，即使用 fillRect。这就是具有 white 背景的 StocQt example 的方法。

但是，如果背景是 transparent，填充它 not 删除其他笔划，因此 not感觉。在这种情况下，清除 Canvas 的唯一可能方法是删除所有笔画，即使用 clearRect.

我使用透明背景，因此 clearRect 适合我。

如何在 qml 中擦除最后的 canvas 油漆

How To wipe the last canvas paint in qml

javascript

canvas

qml

qt5

qtquick2