优化旋律线算法

src/page-instrument/view-detail/smoothAnimation/index.ts

@@ -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()
 }