如何在qml中擦除最后一个画布油漆

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被点击时，画布擦除B的产品被点击的画线，反之亦然。但实际上，它总是保留上次的画线。

Answer 1

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

• fillRect
• clearRect

在大多数情况下，可以通过使用背景颜色填充Canvas，即使用fillRect 来“清除”Canvas。这就是StocQt example 的方法，它有white 背景。

然而，如果背景是transparent，填充它不会删除其他笔画，因此不很有意义。在这种情况下，清除Canvas 的唯一可能方法是删除所有笔划，即使用clearRect。

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