fix:水位延伸线处理

src/views/Screen/index.vue

@@ -1102,6 +1102,7 @@ export default {
             var valFont = 11
             var valueSY = ~~(deviceSY - valFont * this.dpr - 6)
             var text = '水位值' + device.waterValue + '米'
+
             this.drawText({
               x: holeX,
               y: valueSY,
@@ -1122,6 +1123,63 @@ export default {
               var currentDevice = deviceCoords[i]
               var nextDevice = deviceCoords[i + 1]
 
+              // 检查水位线是否在边坡线上方或外部，如果是则跳过延伸线绘制
+              if (this.options.enableBoundaryLimit && this.bianpoLinePoinArr.length > 0) {
+                var isAboveSlope = this.checkIfWaterLineAboveSlope(currentDevice, nextDevice)
+
+                // 额外检查：计算延伸线是否会超出边坡范围
+                var slopeStartX = this.bianpoLinePoinArr[0].x
+                var slopeEndX = this.bianpoLinePoinArr[this.bianpoLinePoinArr.length - 1].x
+                var wouldExtendOutside = false
+
+                // 计算延伸后的坐标
+                var dx = nextDevice.x - currentDevice.x
+                var dy = nextDevice.y - currentDevice.y
+                var length = Math.sqrt(dx * dx + dy * dy)
+                var unitX = dx / length
+                var unitY = dy / length
+                var testStartX = currentDevice.x - unitX * extensionLength
+                var testEndX = nextDevice.x + unitX * extensionLength
+
+                // 检查延伸后是否超出边坡X范围
+                if (testStartX < slopeStartX || testEndX > slopeEndX) {
+                  wouldExtendOutside = true
+                }
+
+                // 检查延伸后是否超出图表的X轴和Y轴边界
+                var testStartY = currentDevice.y - unitY * extensionLength
+                var testEndY = nextDevice.y + unitY * extensionLength
+
+                // 获取图表边界
+                var chartMinX = this.options.initX
+                var chartMaxX = this.options.endX
+                var chartMinY = this.options.initY
+                var chartMaxY = this.options.endY
+
+                // 检查是否超出图表边界
+                if (testStartX < chartMinX || testStartX > chartMaxX ||
+                    testEndX < chartMinX || testEndX > chartMaxX ||
+                    testStartY < chartMinY || testStartY > chartMaxY ||
+                    testEndY < chartMinY || testEndY > chartMaxY) {
+                  wouldExtendOutside = true
+                  console.log('延伸线会超出图表边界')
+                }
+
+                if (isAboveSlope || wouldExtendOutside) {
+                  console.log('水位线在边坡上方或延伸会超出范围，跳过延伸线绘制')
+                  // 只绘制设备之间的连线，不延伸
+                  this.drawLiner({
+                    sx: currentDevice.x,
+                    sy: currentDevice.y,
+                    ex: nextDevice.x,
+                    ey: nextDevice.y,
+                    width: 1,
+                    color: 'blue'
+                  })
+                  continue
+                }
+              }
+
               // 计算线段的方向向量
               var dx = nextDevice.x - currentDevice.x
               var dy = nextDevice.y - currentDevice.y
@@ -1137,6 +1195,20 @@ export default {
               var endX = nextDevice.x + unitX * extensionLength
               var endY = nextDevice.y + unitY * extensionLength
 
+              // 限制延伸线不超出图表的X轴和Y轴边界
+              var chartMinX = this.options.initX
+              var chartMaxX = this.options.endX
+              var chartMinY = this.options.initY
+              var chartMaxY = this.options.endY
+
+              // 限制起点坐标
+              startX = Math.max(chartMinX, Math.min(chartMaxX, startX))
+              startY = Math.max(chartMinY, Math.min(chartMaxY, startY))
+
+              // 限制终点坐标
+              endX = Math.max(chartMinX, Math.min(chartMaxX, endX))
+              endY = Math.max(chartMinY, Math.min(chartMaxY, endY))
+
               // 如果启用边界限制，找到延伸线与边坡线的交点，在交点处停止
               if (this.options.enableBoundaryLimit && this.bianpoLinePoinArr.length > 0) {
                 // 找到左侧延伸线与边坡线的交点
@@ -1691,6 +1763,64 @@ export default {
             })
           }
           return points
+        },
+        // 新增：检查水位线是否在边坡线上方或外部
+        checkIfWaterLineAboveSlope: function(currentDevice, nextDevice) {
+          // 检查水位线的起点和终点是否在边坡线范围内
+          var slopeStartX = this.bianpoLinePoinArr[0].x
+          var slopeEndX = this.bianpoLinePoinArr[this.bianpoLinePoinArr.length - 1].x
+
+          // 如果水位线的任一端点超出边坡线的X范围，认为在边坡外部
+          if (currentDevice.x < slopeStartX || currentDevice.x > slopeEndX ||
+              nextDevice.x < slopeStartX || nextDevice.x > slopeEndX) {
+            console.log('水位线超出边坡X范围')
+            return true
+          }
+
+          // 在水位线的几个关键点检查是否在边坡线上方
+          var checkPoints = [
+            { x: currentDevice.x, y: currentDevice.y },
+            { x: nextDevice.x, y: nextDevice.y },
+            { x: (currentDevice.x + nextDevice.x) / 2, y: (currentDevice.y + nextDevice.y) / 2 } // 中点
+          ]
+
+          var pointsAboveSlope = 0
+
+          for (var i = 0; i < checkPoints.length; i++) {
+            var point = checkPoints[i]
+            var slopeYAtX = this.getSlopeYAtX(point.x)
+
+            // 如果水位线的Y坐标小于边坡线的Y坐标，说明在上方（Y轴向下为正）
+            if (slopeYAtX !== null && point.y < slopeYAtX) {
+              pointsAboveSlope++
+            }
+          }
+
+          // 如果大部分点都在边坡线上方，则认为整条水位线在边坡线上方
+          return pointsAboveSlope >= 2
+        },
+        // 新增：获取指定X坐标处边坡线的Y坐标
+        getSlopeYAtX: function(x) {
+          if (!this.bianpoLinePoinArr || this.bianpoLinePoinArr.length < 2) {
+            return null
+          }
+
+          // 找到包含该X坐标的边坡线段
+          for (var i = 0; i < this.bianpoLinePoinArr.length - 1; i++) {
+            var point1 = this.bianpoLinePoinArr[i]
+            var point2 = this.bianpoLinePoinArr[i + 1]
+
+            if (x >= Math.min(point1.x, point2.x) && x <= Math.max(point1.x, point2.x)) {
+              // 线性插值计算Y坐标
+              if (point2.x === point1.x) {
+                return point1.y // 垂直线段
+              }
+              var t = (x - point1.x) / (point2.x - point1.x)
+              return point1.y + t * (point2.y - point1.y)
+            }
+          }
+
+          return null
         }
       }
       return new cuCharts(ctn, data, opts)