|
@@ -468,9 +468,17 @@ function drawLines(context: CanvasRenderingContext2D, pointsPos: pointsPosType,
|
|
|
context.lineWidth = 2
|
|
|
context.strokeStyle = color
|
|
|
context.beginPath()
|
|
|
- context.moveTo(pointsPos[0].x, pointsPos[0].y)
|
|
|
+ // 记录上一个实际绘制的点
|
|
|
+ let lastDrawnPoint = pointsPos[0]
|
|
|
+ context.moveTo(lastDrawnPoint.x, lastDrawnPoint.y)
|
|
|
for (let i = 1; i < pointsPos.length; i++) {
|
|
|
- context.lineTo(pointsPos[i].x, pointsPos[i].y)
|
|
|
+ const currPoint = pointsPos[i]
|
|
|
+ const distance = Math.hypot(currPoint.x - lastDrawnPoint.x, currPoint.y - lastDrawnPoint.y)
|
|
|
+ // 如果两个点之间的距离大于阈值,才进行绘制
|
|
|
+ if (distance > 2) {
|
|
|
+ context.lineTo(currPoint.x, currPoint.y)
|
|
|
+ lastDrawnPoint = currPoint // 更新上一个实际绘制的点
|
|
|
+ }
|
|
|
}
|
|
|
context.stroke()
|
|
|
}
|