cyy
2025-09-28 fb026e6052b4d843d327312db398cf791ac57ab9
pages/map/js/ctx.js
@@ -468,12 +468,18 @@
         cantainerEl.addEventListener('touchend', function(e) {
            //   _this.canvas._onMouseUp(e);
            //   console.log('touchend:');
            e.preventDefault(); // 阻止默认行为
            _this.touchPoint = {
               x: 0,
               y: 0
            };
            if (_this.pressObjTimer) {
               clearTimeout(_this.pressObjTimer);
               _this.pressObjTimer = null
            }
            const activeObj = _this.canvas.getActiveObject()
            if (!activeObj) {
               // 处理结束事件
@@ -488,16 +494,13 @@
               //    _this.canvas.discardActiveObject();
               // }
            }
            if (this.pressObjTimer) {
               clearTimeout(this.pressObjTimer);
               this.pressObjTimer = null
            }
         });
         cantainerEl.addEventListener('touchcancel', function(e) {
            //   console.log('touchcancel:');
            if (this.pressObjTimer) {
               clearTimeout(this.pressObjTimer);
               this.pressObjTimer = null
            if (_this.pressObjTimer) {
               clearTimeout(_this.pressObjTimer);
               _this.pressObjTimer = null
            }
         })
@@ -522,6 +525,7 @@
               const list = _this.canvas.getActiveObjects()
               if (list.length === 1) {
                  if (!_this.objEditing) {
                     this.pressObjTimer = setTimeout(function() {
                        const zoom = _this.canvas.getZoom();
@@ -569,6 +573,7 @@
                           });
                        }
                     }, 1000); //
                  }
                  let activeObj = list[0]
                  if (activeObj.eleType == "region_pt_add") {
@@ -812,7 +817,10 @@
            if (obj instanceof fabric.Path || obj instanceof fabric.Line) {
               if (this.isPointOnStroke(obj, pointer, 1)) {
                  if (objActive != obj) {
                     if (this.pressObjTimer) {
                        clearTimeout(this.pressObjTimer);
                        this.pressObjTimer = null
                     }
                     this.canvas.discardActiveObject()
                     this.canvas.setActiveObject(obj);
                     this.canvas.requestRenderAll();
@@ -822,7 +830,10 @@
               pointerList2.unshift(obj)
            } else {
               if (objActive != obj) {
                  if (this.pressObjTimer) {
                     clearTimeout(this.pressObjTimer);
                     this.pressObjTimer = null
                  }
                  this.canvas.discardActiveObject()
                  this.canvas.setActiveObject(obj);
                  this.canvas.requestRenderAll();
@@ -835,7 +846,10 @@
            if (pointerList2.length == 1) {
               const obj = pointerList2[0];
               if (objActive != obj) {
                  if (this.pressObjTimer) {
                     clearTimeout(this.pressObjTimer);
                     this.pressObjTimer = null
                  }
                  this.canvas.discardActiveObject()
                  this.canvas.setActiveObject(obj);
                  this.canvas.requestRenderAll();
@@ -848,7 +862,10 @@
               const obj = pointerList[i];
               if (this.isPointOnStroke(obj, pointer, 2)) {
                  if (objActive != obj) {
                     if (this.pressObjTimer) {
                        clearTimeout(this.pressObjTimer);
                        this.pressObjTimer = null
                     }
                     this.canvas.discardActiveObject()
                     this.canvas.setActiveObject(obj);
                     this.canvas.requestRenderAll();
@@ -862,7 +879,10 @@
            if (pointerList2.length == 1) {
               const obj = pointerList2[0];
               if (objActive != obj) {
                  if (this.pressObjTimer) {
                     clearTimeout(this.pressObjTimer);
                     this.pressObjTimer = null
                  }
                  this.canvas.discardActiveObject()
                  this.canvas.setActiveObject(obj);
                  this.canvas.requestRenderAll();
@@ -875,7 +895,10 @@
               const obj = pointerList[i];
               if (this.isPointOnStroke(obj, pointer, 3)) {
                  if (objActive != obj) {
                     if (this.pressObjTimer) {
                        clearTimeout(this.pressObjTimer);
                        this.pressObjTimer = null
                     }
                     this.canvas.discardActiveObject()
                     this.canvas.setActiveObject(obj);
                     this.canvas.requestRenderAll();
@@ -889,7 +912,10 @@
            if (pointerList2.length == 1) {
               const obj = pointerList2[0];
               if (objActive != obj) {
                  if (this.pressObjTimer) {
                     clearTimeout(this.pressObjTimer);
                     this.pressObjTimer = null
                  }
                  this.canvas.discardActiveObject()
                  this.canvas.setActiveObject(obj);
                  this.canvas.requestRenderAll();
@@ -902,7 +928,10 @@
               const obj = pointerList[i];
               if (this.isPointOnStroke(obj, pointer, 4)) {
                  if (objActive != obj) {
                     if (this.pressObjTimer) {
                        clearTimeout(this.pressObjTimer);
                        this.pressObjTimer = null
                     }
                     this.canvas.discardActiveObject()
                     this.canvas.setActiveObject(obj);
                     this.canvas.requestRenderAll();
@@ -916,7 +945,10 @@
            const obj = pointerList2[pointerList2.length - 1];
            if (objActive != obj) {
               if (this.pressObjTimer) {
                  clearTimeout(this.pressObjTimer);
                  this.pressObjTimer = null
               }
               this.canvas.discardActiveObject()
               this.canvas.setActiveObject(obj);
               this.canvas.requestRenderAll();
@@ -1202,7 +1234,7 @@
               _this.$ownerInstance.callMethod('receiveRenderData', {
                  method: "set_backgroud_progress",
                  type: "error",
                  msg:err
                  msg: err
               });
               console.error("图片加载失败", err)
               reject(new Error('图片加载失败'));
@@ -1370,6 +1402,8 @@
                     // _this.canvas.renderAll()
                     _this.workSpace = wsGroup
                     const scale = _this.eleWidth / (4 * 84)
                     _this.setZoomAuto(scale); //
                  }
                  //_this.checkMemoryUsage()
                  resolve()
@@ -1391,7 +1425,7 @@
                     strokeLineCap: 'butt',
                     fill: "rgba(255,255,255,0)",
                  })
                  let wsGroup = new fabric.Group([ rect], {
                  let wsGroup = new fabric.Group([rect], {
                     id: "workspace",
                     eleType: "workspace",
                     selectable: false,
@@ -1400,11 +1434,13 @@
                     top: 0,
                     width: _this.mapInfo.img_x,
                     height: _this.mapInfo.img_y,
                  });
                  _this.clearObjects()
                  _this.canvas.add(wsGroup)
                  _this.workSpace = wsGroup
                  const scale = _this.eleWidth / (4 * 84)
                  _this.setZoomAuto(scale); //
                  resolve()
               })
@@ -1539,11 +1575,13 @@
                  clearTimeout(this.pressObjTimer);
                  this.pressObjTimer = null
               }
            }
            if (Math.abs(deltaX) > 20 || Math.abs(deltaY) > 20) {
               this.$ownerInstance.callMethod('receiveRenderData', {
                  method: "cancel_positioning_agv",
               });
            }
            // 移动视口
            const vpt = this.canvas.viewportTransform;
            this.canvas.relativePan(new fabric.Point(deltaX, deltaY));
@@ -1773,9 +1811,7 @@
         }
         //console.log(scale, scaleAuto)
         this.setZoomAuto(scale, center)
         this.$ownerInstance.callMethod('receiveRenderData', {
            method: "cancel_positioning_agv",
         });
         //   console.log('多点移动 - 距离:', distance, '角度:', angle);
         // 多点移动逻辑
      },
@@ -1886,7 +1922,7 @@
            const left = _this.getXOnImg(info.x) // * scale
            const top = _this.getYOnImg(info.y) //* scale
            const angle = info.angle * 180 / Math.PI
            const angle = -(info.angle * 180 / Math.PI)
            fabric.loadSVGFromURL(svg).then(
               ({
                  objects,
@@ -2018,7 +2054,8 @@
            this.canvas.remove(this.curTeachingObj)
            this.curTeachingObj = null
         }
         if (teachingData.lenght === 0)
            return
         posArr.forEach((item) => {
            const curIndex = pos_list.findIndex((item2) => item2.x === item.x && item2.y === item.y)
            if (curIndex < 0) {
@@ -2042,40 +2079,41 @@
               y: this.getYOnImg(pt.y)
            }
            if (index > 0) {
               if ((index % 50 == 0 || index == len - 1 || index % 50 == 1)) {
                  if (index % 50 == 0 || index == len - 1) {
                     toX = pt2.x
                     toY = pt2.y
                     path2 += ` L${pt2.x} ${pt2.y}`
               // if ((index % 50 == 0 || index == len - 1 || index % 50 == 1)) {
               //    if (index % 50 == 0 || index == len - 1) {
               //       toX = pt2.x
               //       toY = pt2.y
               //       path2 += ` L${pt2.x} ${pt2.y}`
                     // 计算各角度和对应的P2,P3坐标
                     let angle = (Math.atan2(fromY - toY, fromX - toX) * 180) / Math.PI,
                        angle1 = ((angle + theta) * Math.PI) / 180,
                        angle2 = ((angle - theta) * Math.PI) / 180,
                        topX = headlen * Math.cos(angle1),
                        topY = headlen * Math.sin(angle1),
                        botX = headlen * Math.cos(angle2),
                        botY = headlen * Math.sin(angle2);
                     let arrowX = fromX - topX,
                        arrowY = fromY - topY;
                     arrowX = toX + topX;
                     arrowY = toY + topY;
                     path2 += " L " + arrowX + " " + arrowY;
                     arrowX = toX + botX;
                     arrowY = toY + botY;
                     path2 += " M " + arrowX + " " + arrowY;
                     path2 += " L " + toX + " " + toY;
                  }
               } else {
                  path2 += ` L${pt2.x} ${pt2.y}`
               }
               //       // 计算各角度和对应的P2,P3坐标
               //       let angle = (Math.atan2(fromY - toY, fromX - toX) * 180) / Math.PI,
               //          angle1 = ((angle + theta) * Math.PI) / 180,
               //          angle2 = ((angle - theta) * Math.PI) / 180,
               //          topX = headlen * Math.cos(angle1),
               //          topY = headlen * Math.sin(angle1),
               //          botX = headlen * Math.cos(angle2),
               //          botY = headlen * Math.sin(angle2);
               //       let arrowX = fromX - topX,
               //          arrowY = fromY - topY;
               //       arrowX = toX + topX;
               //       arrowY = toY + topY;
               //       path2 += " L " + arrowX + " " + arrowY;
               //       arrowX = toX + botX;
               //       arrowY = toY + botY;
               //       path2 += " M " + arrowX + " " + arrowY;
               //       path2 += " L " + toX + " " + toY;
               //    }
               // } else {
               //    path2 += ` L${pt2.x} ${pt2.y}`
               // }
               path2 += ` L${pt2.x} ${pt2.y}`
            } else {
               path2 = `M${pt2.x} ${pt2.y}`
            }
            fromX = pt2.x
            fromY = pt2.y
         }
         let strokeWidth = 1
         let strokeWidth = 5
         let stroke = "#95DE64"
         if (main_road == 1) {
@@ -2132,72 +2170,73 @@
               y: this.getYOnImg(pt.y)
            }
            if (index > 0) {
               if ((type == "public_teaching") && (index % 50 == 0 || index == len - 1 || index % 50 == 1)) {
                  if (index % 50 == 1 || index == len - 1) {
                     if (teachingData.bidirection == 1 && index < len - 1) { //- 1
                        toY = fromY
                        toX = fromX
                        fromX = pt2.x
                        fromY = pt2.y
                        let angle = (Math.atan2(fromY - toY, fromX - toX) * 180) / Math.PI,
                           angle1 = ((angle + theta) * Math.PI) / 180,
                           angle2 = ((angle - theta) * Math.PI) / 180,
                           topX = headlen * Math.cos(angle1),
                           topY = headlen * Math.sin(angle1),
                           botX = headlen * Math.cos(angle2),
                           botY = headlen * Math.sin(angle2);
                        let arrowX = fromX - topX,
                           arrowY = fromY - topY;
                        arrowX = toX + topX;
                        arrowY = toY + topY;
                        let path3 = " L " + arrowX + " " + arrowY;
                        arrowX = toX + botX;
                        arrowY = toY + botY;
                        path3 += " M " + arrowX + " " + arrowY;
                        path3 += " L " + toX + " " + toY;
               // if ((type == "public_teaching") && (index % 50 == 0 || index == len - 1 || index % 50 == 1)) {
               //    if (index % 50 == 1 || index == len - 1) {
               //       if (teachingData.bidirection == 1 && index < len - 1) { //- 1
               //          toY = fromY
               //          toX = fromX
               //          fromX = pt2.x
               //          fromY = pt2.y
               //          let angle = (Math.atan2(fromY - toY, fromX - toX) * 180) / Math.PI,
               //             angle1 = ((angle + theta) * Math.PI) / 180,
               //             angle2 = ((angle - theta) * Math.PI) / 180,
               //             topX = headlen * Math.cos(angle1),
               //             topY = headlen * Math.sin(angle1),
               //             botX = headlen * Math.cos(angle2),
               //             botY = headlen * Math.sin(angle2);
               //          let arrowX = fromX - topX,
               //             arrowY = fromY - topY;
               //          arrowX = toX + topX;
               //          arrowY = toY + topY;
               //          let path3 = " L " + arrowX + " " + arrowY;
               //          arrowX = toX + botX;
               //          arrowY = toY + botY;
               //          path3 += " M " + arrowX + " " + arrowY;
               //          path3 += " L " + toX + " " + toY;
                        path2 += path3
                        fromY = toY
                        fromX = toX
                     }
                  }
                  if (index % 50 == 0 || index == len - 1) {
                     toX = pt2.x
                     toY = pt2.y
                     // if (fromX == toX && fromY == toY) {
                     //    if (index - 2 >= 0) {
                     //       const pt3 = pos_list[index - 2]
                     //       fromX = this.getXOnImg(pt3.x),
                     //          fromY = this.getYOnImg(pt3.y)
                     //    } else {
                     //       continue;
                     //    }
                     // }
                     path2 += ` L${pt2.x} ${pt2.y}`
               //          path2 += path3
               //          fromY = toY
               //          fromX = toX
               //       }
               //    }
               //    if (index % 50 == 0 || index == len - 1) {
               //       toX = pt2.x
               //       toY = pt2.y
               //       // if (fromX == toX && fromY == toY) {
               //       //    if (index - 2 >= 0) {
               //       //       const pt3 = pos_list[index - 2]
               //       //       fromX = this.getXOnImg(pt3.x),
               //       //          fromY = this.getYOnImg(pt3.y)
               //       //    } else {
               //       //       continue;
               //       //    }
               //       // }
               //       path2 += ` L${pt2.x} ${pt2.y}`
                     // 计算各角度和对应的P2,P3坐标
                     let angle = (Math.atan2(fromY - toY, fromX - toX) * 180) / Math.PI,
                        angle1 = ((angle + theta) * Math.PI) / 180,
                        angle2 = ((angle - theta) * Math.PI) / 180,
                        topX = headlen * Math.cos(angle1),
                        topY = headlen * Math.sin(angle1),
                        botX = headlen * Math.cos(angle2),
                        botY = headlen * Math.sin(angle2);
                     let arrowX = fromX - topX,
                        arrowY = fromY - topY;
                     arrowX = toX + topX;
                     arrowY = toY + topY;
                     path2 += " L " + arrowX + " " + arrowY;
                     arrowX = toX + botX;
                     arrowY = toY + botY;
                     path2 += " M " + arrowX + " " + arrowY;
                     path2 += " L " + toX + " " + toY;
                  }
                  //   console.log(`箭头 L${pt2.x} ${pt2.y}`)
               } else {
                  //   console.log(`点 L${pt2.x} ${pt2.y} ${index} == ${len-1}`)
                  path2 += ` L${pt2.x} ${pt2.y}`
               }
               //       // 计算各角度和对应的P2,P3坐标
               //       let angle = (Math.atan2(fromY - toY, fromX - toX) * 180) / Math.PI,
               //          angle1 = ((angle + theta) * Math.PI) / 180,
               //          angle2 = ((angle - theta) * Math.PI) / 180,
               //          topX = headlen * Math.cos(angle1),
               //          topY = headlen * Math.sin(angle1),
               //          botX = headlen * Math.cos(angle2),
               //          botY = headlen * Math.sin(angle2);
               //       let arrowX = fromX - topX,
               //          arrowY = fromY - topY;
               //       arrowX = toX + topX;
               //       arrowY = toY + topY;
               //       path2 += " L " + arrowX + " " + arrowY;
               //       arrowX = toX + botX;
               //       arrowY = toY + botY;
               //       path2 += " M " + arrowX + " " + arrowY;
               //       path2 += " L " + toX + " " + toY;
               //    }
               //    //   console.log(`箭头 L${pt2.x} ${pt2.y}`)
               // } else {
               //    //   console.log(`点 L${pt2.x} ${pt2.y} ${index} == ${len-1}`)
               //    path2 += ` L${pt2.x} ${pt2.y}`
               // }
               path2 += ` L${pt2.x} ${pt2.y}`
            } else {
               main_road = pt.main_road
               if (main_road == 1) {
@@ -2213,13 +2252,20 @@
         // console.log("addTeachingPath",path2)
         // path2 += " Z"
         let strokeWidth = 1
         let strokeWidth = 2
         let stroke = "#95DE64"
         if (type == "station_teaching") {
            stroke = "#69C0FF"
         } else {
            if (main_road == 1) {
               stroke = "#69C0FF"
               if (teachingData.bidirection == 1) {
                  stroke = "#FF00FF"
               }
            } else {
               if (teachingData.bidirection == 1) {
                  stroke = "#ffaa00"
               }
            }
         }
         let list = this.canvas.getObjects() || []
@@ -2461,7 +2507,7 @@
            //   const scale = this.getAutoScale()
            const left = _this.getXOnImg(info.x) // * scale
            const top = _this.getYOnImg(info.y) //* scale
            const angle = info.angle * 180 / Math.PI
            const angle = -(info.angle * 180 / Math.PI) + 90
            if (obj) {
               obj.set({
                  left,
@@ -3028,7 +3074,7 @@
         this.canvas.remove(obj)
      },
      updateAgvLaser(param) {
         const angle = param.angle - Math.PI / 2 // * 180 / Math.PI
         const angle = -param.angle //- Math.PI / 2 // * 180 / Math.PI
         const pt = {
            x: this.getXOnImg(param.x),
            y: this.getYOnImg(param.y)
@@ -3066,7 +3112,7 @@
            id: "agv_laser_angle",
            eleType: "agv_laser_angle",
            stroke: "#00aa00",
            strokeWidth: 2,
            strokeWidth: 1,
            lockRotation: true,
            lockScalingX: true,
            lockScalingY: true,
@@ -3325,7 +3371,7 @@
                     } else {
                        //   _this.canvas.remove(list[curIndex])
                        const curStationObj = list[curIndex]
                        const angle = station.angle * 180 / Math.PI
                        const angle = -station.angle * 180 / Math.PI
                        //const scale = this.getAutoScale()
                        const left = this.getXOnImg(station.x) //* scale
                        const top = this.getYOnImg(station.y) //* scale
@@ -3360,6 +3406,7 @@
               } else if (item.method == "remove_station") {
                  const stationList = item.param || []
                  this.canvas.discardActiveObject()
                  let list = _this.canvas.getObjects() || []
                  list = list.filter((a) => a.eleType == "station")
@@ -3536,6 +3583,7 @@
                  _this.showTeachingPath(_this.showTeachPathFlag ? true : false)
               } else if (item.method == "clear_teaching_path") {
                  this.canvas.discardActiveObject()
                  let list = _this.canvas.getObjects() || []
                  list = list.filter((a) => a.eleType == "public_teaching" || a.eleType ==
                     "station_teaching")
@@ -3575,6 +3623,7 @@
                  _this.showTeachingPath(item.param.show)
               } else if (item.method == "remove_teaching_path") {
                  this.canvas.discardActiveObject()
                  let list = _this.canvas.getObjects() || []
                  if (item.param.mode == "Public") {
                     list = list.filter((a) => a.eleType == "public_teaching")
@@ -3648,6 +3697,7 @@
                  }
               } else if (item.method == "remove_wall") {
                  const wallList = item.param || []
                  this.canvas.discardActiveObject()
                  let list = _this.canvas.getObjects() || []
                  list = list.filter((a) => a.eleType == "virtual_wall")
                  for (let i2 in wallList) {
@@ -3659,6 +3709,7 @@
                  }
               } else if (item.method == "remove_region") {
                  const regionList = item.param || []
                  this.canvas.discardActiveObject()
                  let list = _this.canvas.getObjects() || []
                  list = list.filter((a) => a.eleType == "region")
                  for (let i2 in regionList) {