From 1b9c2ba8e4f35fc6d616c51482789cbfb5a581fd Mon Sep 17 00:00:00 2001
From: caill <815519168@qq.com>
Date: Fri, 25 Jul 2025 18:43:20 +0800
Subject: [PATCH] map

---
 src/config/getData.js          |   1 +
 src/images/new/agv.png         | Bin 1612 -> 1574 bytes
 src/images/new/car.png         | Bin 0 -> 4479 bytes
 src/pages/modules/building.vue |  30 ++-
 src/pages/modules/map.vue      | 203 +++++++++++++++-
 src/pages/modules/map2.vue     | 430 +++++++++++++++++++++++++++++++++
 6 files changed, 650 insertions(+), 14 deletions(-)
 create mode 100644 src/images/new/car.png
 create mode 100644 src/pages/modules/map2.vue

diff --git a/src/config/getData.js b/src/config/getData.js
index e0eb070..66e7445 100644
--- a/src/config/getData.js
+++ b/src/config/getData.js
@@ -11,6 +11,7 @@ export const setStation = (sn) => post('teaching/setStation?stationName=' + sn,
 export const stopMapping = () => post('teaching/stopMapping', {})
 export const getLocalMaps = () => post('teaching/getLocalMaps', {})
 export const oneClickDeployment = (map) => post('teaching/oneClickDeployment?mapName=' + map, {})
+export const abandonMapping = () => post('teaching/abandonMapping', {})
 
 // 操作
 export const queryStation = () => post('api/operate/queryStation', {})
diff --git a/src/images/new/agv.png b/src/images/new/agv.png
index bb3117fa59c8fd87350a292280b6bf0c321d93bb..12e5db33e00ed859f99ad1b58f0f09e0026daf52 100644
GIT binary patch
delta 1558
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
IM6N<$f;F`(q5uE@

delta 1596
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

diff --git a/src/images/new/car.png b/src/images/new/car.png
new file mode 100644
index 0000000000000000000000000000000000000000..1806599a480143e54a14c0ce491a856c482e86f6
GIT binary patch
literal 4479
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
baj8JX<Vo*HU9@patN@y-dMY*0XK(%mHMU#T

literal 0
HcmV?d00001

diff --git a/src/pages/modules/building.vue b/src/pages/modules/building.vue
index 05b677d..9b58d88 100644
--- a/src/pages/modules/building.vue
+++ b/src/pages/modules/building.vue
@@ -41,7 +41,7 @@
 </template>
 
 <script>
-import { startMapping, setStation, stopMapping, getLocalMaps, oneClickDeployment } from '@config/getData.js'
+import { startMapping, setStation, stopMapping, getLocalMaps, oneClickDeployment, abandonMapping } from '@config/getData.js'
 export default {
   beforeRouteLeave (to, from, next) {
     if (this.needsConfirmation) {
@@ -49,8 +49,32 @@ export default {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning'
-      }).then(() => {
-        next() // 允许离开
+      }).then(async () => {
+        try {
+          // 显示加载中状态
+          this.loading = this.$loading({
+            lock: true,
+            spinner: 'el-icon-loading',
+            background: 'rgba(0, 0, 0, 0.6)'
+          })
+          // 调用放弃建图接口
+          const res = await abandonMapping()
+          this.loading.close()
+          if (res && res.code === 200) {
+            // 接口成功，允许离开页面
+            this.needsConfirmation = false // 标记无需再确认
+            next()
+          } else {
+            // 接口返回失败，提示错误并阻止离开
+            this.$message.error(res.message || '放弃建图失败，请重试')
+            next(false)
+          }
+        } catch (error) {
+          // 发生异常，提示错误并阻止离开
+          this.loading.close()
+          this.$message.error('操作失败：' + error.message)
+          next(false)
+        }
       }).catch(() => {
         next(false) // 阻止离开
       })
diff --git a/src/pages/modules/map.vue b/src/pages/modules/map.vue
index 93b3825..2e02137 100644
--- a/src/pages/modules/map.vue
+++ b/src/pages/modules/map.vue
@@ -47,14 +47,35 @@
         <el-col :span="14"><p>{{ selectedPoint.angle }}</p></el-col>
       </el-row>
     </div>
+    <div
+      v-if="showPathPopup"
+      class="point-popup"
+      :style="pathPopupStyle"
+      @click.stop
+    >
+      <el-row type="flex" justify="space-between" class="popup-content" style="border-bottom: 1px solid #fff;">
+        <el-col :span="10"><h3>路径ID</h3></el-col>
+        <el-col :span="14"><p>{{selectedPath.route_id}}</p></el-col>
+      </el-row>
+      <el-row type="flex" justify="space-between" class="popup-content">
+        <el-col :span="10"><h3>起点编码</h3></el-col>
+        <el-col :span="14"><p>{{getStationNameById(selectedPath.start_id)}}</p></el-col>
+      </el-row>
+      <el-row type="flex" justify="space-between" class="popup-content">
+        <el-col :span="10"><h3>终点编码</h3></el-col>
+        <el-col :span="14"><p>{{getStationNameById(selectedPath.end_id)}}</p></el-col>
+      </el-row>
+    </div>
   </div>
 </template>
 
 <script>
 import { throttle } from 'lodash'
 import markerImage from '@images/new/agv.png'
+import carImage from '@images/new/car.png'
 import { getMapInfoByCode, getRouteInfo, queryMapAllStation } from '@config/getData.js'
 import canvasZoomDrag from '@config/canvasZoomDrag'
+import { mapGetters } from 'vuex'
 export default {
   data () {
     return {
@@ -69,25 +90,72 @@ export default {
       selectedPointId: null,
       cachedImages: {
         map: null,
-        marker: null
+        marker: null,
+        car: null
       },
       imageLoadStatus: {
         map: false,
-        marker: false
+        marker: false,
+        car: false
+      },
+      showPathPopup: false,
+      selectedPath: {route_id: null},
+      pathPopupStyle: { left: '0px', top: '0px' },
+      pathClickThreshold: 5
+    }
+  },
+  computed: {
+    ...mapGetters(['agvObj']),
+    carData () {
+      try {
+        return JSON.parse(this.agvObj)
+      } catch (error) {
+        console.error('解析 JSON 时出错:', error)
+        return {}
       }
     }
   },
   mixins: [canvasZoomDrag],
   mounted () {
     this.preloadMarkerImage()
+    this.preloadCarImage()
     this.loadAllDataInParallel()
     document.addEventListener('click', this.handleDocumentClick)
+    this.carPositionWatcher = this.$watch(
+      () => this.carData,
+      (newVal) => {
+        if (newVal && newVal.x !== undefined && newVal.y !== undefined) {
+          this.redrawCanvas()
+        }
+      },
+      { deep: true }
+    )
   },
   beforeDestroy () {
-    // 移除事件监听
     document.removeEventListener('click', this.handleDocumentClick)
+    if (this.carPositionWatcher) {
+      this.carPositionWatcher()
+    }
   },
   methods: {
+    preloadCarImage () {
+      if (this.cachedImages.car) {
+        this.imageLoadStatus.car = true
+        return
+      }
+      const img = new Image()
+      img.src = carImage
+      img.onload = () => {
+        this.cachedImages.car = img
+        this.imageLoadStatus.car = true
+        this.checkImagesLoadedAndRedraw()
+      }
+      img.onerror = () => {
+        console.error('小车图片加载失败')
+        this.imageLoadStatus.car = true
+        this.checkImagesLoadedAndRedraw()
+      }
+    },
     preloadMarkerImage () {
       if (this.cachedImages.marker) {
         this.imageLoadStatus.marker = true
@@ -131,7 +199,7 @@ export default {
       })
     },
     checkImagesLoadedAndRedraw () {
-      if (this.imageLoadStatus.map && this.imageLoadStatus.marker) {
+      if (this.imageLoadStatus.map && this.imageLoadStatus.marker && this.imageLoadStatus.car) {
         this.redrawCanvas()
       }
     },
@@ -230,22 +298,28 @@ export default {
       }
       this.drawPath()
       this.drawMarkers()
+      this.drawCar()
       this.ctx.restore()
     }, 30),
     drawPath () {
       if (!this.pathData.length) return
-      this.ctx.beginPath()
       this.pathData.forEach((point, index) => {
         const startX = (point.start_x - this.mapData.x) / this.mapData.resolution
         const startY = this.mapData.height - (point.start_y - this.mapData.y) / this.mapData.resolution
         const endX = (point.end_x - this.mapData.x) / this.mapData.resolution
         const endY = this.mapData.height - (point.end_y - this.mapData.y) / this.mapData.resolution
+        this.ctx.beginPath()
         this.ctx.moveTo(startX, startY)
         this.ctx.lineTo(endX, endY)
+        if (this.selectedPath.route_id === point.route_id) {
+          this.ctx.strokeStyle = '#ff5722' // 橙色高亮
+          this.ctx.lineWidth = 4
+        } else {
+          this.ctx.strokeStyle = '#009de5' // 默认蓝色
+          this.ctx.lineWidth = 2
+        }
+        this.ctx.stroke()
       })
-      this.ctx.strokeStyle = '#009de5'
-      this.ctx.lineWidth = 2
-      this.ctx.stroke()
     },
     drawMarkers () {
       if (!this.pointData.length) return
@@ -275,10 +349,24 @@ export default {
         this.ctx.fillText(point.station_name, x, y + 18)
       })
     },
+    drawCar () {
+      if (!this.carData || !this.cachedImages.car || !this.mapData) return
+      const carX = (this.carData.x - this.mapData.x) / this.mapData.resolution
+      const carY = this.mapData.height - (this.carData.y - this.mapData.y) / this.mapData.resolution
+      this.ctx.drawImage(
+        this.cachedImages.car,
+        carX - 35,
+        carY - 21,
+        70,
+        42
+      )
+    },
     handleCanvasClick (event) {
       const rect = this.canvas.getBoundingClientRect()
       const mouseX = (event.clientX - rect.left) / this.scale
       const mouseY = (event.clientY - rect.top) / this.scale
+      // 1. 优先检测点位点击
+      let pointClicked = false
       this.pointData.forEach(point => {
         let x = (point.x - this.mapData.x) / this.mapData.resolution
         let y = this.mapData.height - (point.y - this.mapData.y) / this.mapData.resolution
@@ -288,10 +376,62 @@ export default {
         if (mouseX >= x - 10 && mouseX <= x + 10 && mouseY >= y - 10 && mouseY <= y + 10) {
           this.handlePointSelect(point, event)
           event.stopPropagation()
+          pointClicked = true
         }
       })
+      // 2. 只有点位未被点击时，才检测路径点击
+      if (!pointClicked) {
+        const clickedPath = this.detectPathClick(mouseX, mouseY)
+        if (clickedPath) {
+          this.handlePathSelect(clickedPath, event)
+          event.stopPropagation()
+        }
+      }
+    },
+    // 检测路径点击
+    detectPathClick (mouseX, mouseY) {
+      if (!this.pathData.length) return null
+      for (const path of this.pathData) {
+        // 计算路径线段的Canvas坐标
+        const startX = (path.start_x - this.mapData.x) / this.mapData.resolution
+        const startY = this.mapData.height - (path.start_y - this.mapData.y) / this.mapData.resolution
+        const endX = (path.end_x - this.mapData.x) / this.mapData.resolution
+        const endY = this.mapData.height - (path.end_y - this.mapData.y) / this.mapData.resolution
+        // 计算点击点到线段的距离
+        const distance = this.pointToLineDistance(
+          { x: mouseX, y: mouseY },
+          { x: startX, y: startY },
+          { x: endX, y: endY }
+        )
+        // 距离小于阈值则认为点击了该路径
+        if (distance <= this.pathClickThreshold) {
+          return path
+        }
+      }
+      return null
+    },
+    // 计算点到线段的最短距离
+    pointToLineDistance (point, lineStart, lineEnd) {
+      // 线段向量
+      const dx = lineEnd.x - lineStart.x
+      const dy = lineEnd.y - lineStart.y
+      // 线段长度的平方
+      const lengthSquared = dx * dx + dy * dy
+      // 线段长度为0（起点终点重合），直接返回点到起点的距离
+      if (lengthSquared === 0) {
+        return Math.hypot(point.x - lineStart.x, point.y - lineStart.y)
+      }
+      // 计算点击点在投影到线段上的位置比例（0~1之间为在线段上）
+      let t = ((point.x - lineStart.x) * dx + (point.y - lineStart.y) * dy) / lengthSquared
+      t = Math.max(0, Math.min(1, t)) // 限制在0~1范围内
+      // 投影点坐标
+      const projectionX = lineStart.x + t * dx
+      const projectionY = lineStart.y + t * dy
+      // 点到投影点的距离
+      return Math.hypot(point.x - projectionX, point.y - projectionY)
     },
     handlePointSelect (point, event) {
+      this.resetPathSelection()
       if (this.selectedPointId === point.station_id) {
         this.resetSelection()
       } else {
@@ -302,6 +442,20 @@ export default {
         this.redrawCanvas()
       }
     },
+    // 处理路径选中
+    handlePathSelect (path, event) {
+      // 关闭点位弹窗（避免冲突）
+      this.resetPointSelection()
+      if (this.selectedPath.route_id === path.route_id) {
+        // 再次点击同一路径关闭弹窗
+        this.resetPathSelection()
+      } else {
+        this.selectedPath = path
+        this.showPathPopup = true
+        this.calculatePathPopupPosition(event)
+        this.redrawCanvas() // 高亮显示选中路径
+      }
+    },
     calculatePopupPosition (event) {
       const popupWidth = 200
       const popupHeight = 180
@@ -314,16 +468,43 @@ export default {
 
       this.popupStyle = { left: `${left}px`, top: `${top}px` }
     },
+    // 计算路径弹窗位置
+    calculatePathPopupPosition (event) {
+      const popupWidth = 160
+      const popupHeight = 100
+      let left = event.clientX - 40
+      let top = event.clientY - 120
+      // 限制弹窗在窗口可视范围内
+      left = Math.max(10, Math.min(left, window.innerWidth - popupWidth - 10))
+      top = Math.max(10, Math.min(top, window.innerHeight - popupHeight - 10))
+      this.pathPopupStyle = { left: `${left}px`, top: `${top}px` }
+    },
     handleDocumentClick () {
       this.resetSelection()
     },
-    resetSelection () {
+    resetPointSelection () {
       if (this.selectedPointId) {
         this.selectedPointId = null
         this.selectedPoint = null
         this.showPopup = false
-        this.redrawCanvas()
       }
+    },
+    // 重置路径选中状态
+    resetPathSelection () {
+      if (this.selectedPath) {
+        this.selectedPath = {route_id: null}
+        this.showPathPopup = false
+      }
+    },
+    resetSelection () {
+      this.resetPointSelection()
+      this.resetPathSelection()
+      this.redrawCanvas()
+    },
+    getStationNameById (stationId) {
+      if (!stationId || !this.pointData || !this.pointData.length) return null
+      const station = this.pointData.find(point => point.station_id === stationId)
+      return station ? station.station_name : null
     }
   }
 }
@@ -360,7 +541,7 @@ export default {
   padding 10px
   box-shadow 0 0px 4px 2px rgba(255,255,255,0.1)
   z-index 100
-  min-width 150px
+  min-width 160px
   animation fadeIn 0.2s ease-out
   h3
     color #fff
diff --git a/src/pages/modules/map2.vue b/src/pages/modules/map2.vue
new file mode 100644
index 0000000..aff030b
--- /dev/null
+++ b/src/pages/modules/map2.vue
@@ -0,0 +1,430 @@
+
+<template>
+  <div class="page_container">
+    <div class="canvas-container">
+      <canvas
+        id="mapCanvas"
+        ref="mapCanvas"
+        @wheel="handleZoom"
+        @click="handleCanvasClick"
+        @touchstart="handleTouchStart"
+        @touchmove="handleTouchMove"
+        @mousedown="handleMouseDown"
+        @mousemove="handleMouseMove"
+        @mouseup="handleMouseUp"
+        @mouseleave="handleMouseUp"
+      ></canvas>
+      <el-row type="flex" justify="end" class="map_tools">
+        <el-button type="primary" :disabled="zoomPercentage === 2" icon="el-icon-minus" size="mini" style="border: 0;border-radius: 0;" @click="zoomOut"></el-button>
+        <div class="zoom_data">{{ zoomPercentage }}%</div>
+        <el-button type="primary" :disabled="zoomPercentage === 200" icon="el-icon-plus" size="mini" style="border: 0;border-radius: 0;" @click="zoomIn"></el-button>
+      </el-row>
+    </div>
+    <div
+      v-if="showPopup"
+      class="point-popup"
+      :style="popupStyle"
+      @click.stop
+    >
+      <el-row type="flex" justify="space-between" class="popup-content" style="border-bottom: 1px solid #fff;">
+        <el-col :span="10"><h3>编号</h3></el-col>
+        <el-col :span="14"><p>{{selectedPoint.station_code}}</p></el-col>
+      </el-row>
+      <el-row type="flex" justify="space-between" class="popup-content">
+        <el-col :span="10"><h3>别名</h3></el-col>
+        <el-col :span="14"><p>{{selectedPoint.station_name}}</p></el-col>
+      </el-row>
+      <el-row type="flex" justify="space-between" class="popup-content">
+        <el-col :span="10"><h3>X坐标</h3></el-col>
+        <el-col :span="14"><p>{{ selectedPoint.x }}</p></el-col>
+      </el-row>
+      <el-row type="flex" justify="space-between" class="popup-content">
+        <el-col :span="10"><h3>Y坐标</h3></el-col>
+        <el-col :span="14"><p>{{ selectedPoint.y }}</p></el-col>
+      </el-row>
+      <el-row type="flex" justify="space-between" class="popup-content">
+        <el-col :span="10"><h3>角度值</h3></el-col>
+        <el-col :span="14"><p>{{ selectedPoint.angle }}</p></el-col>
+      </el-row>
+    </div>
+  </div>
+</template>
+
+<script>
+import { throttle } from 'lodash'
+import markerImage from '@images/new/agv.png'
+import carImage from '@images/new/car.png'
+import { getMapInfoByCode, getRouteInfo, queryMapAllStation } from '@config/getData.js'
+import canvasZoomDrag from '@config/canvasZoomDrag'
+import { mapGetters } from 'vuex'
+export default {
+  data () {
+    return {
+      canvas: null, // Canvas 元素
+      ctx: null, // Canvas 绘图上下文
+      mapData: null, // 地图数据
+      pathData: null, // 路径数据
+      pointData: null, // 点位数据
+      showPopup: false,
+      selectedPoint: {},
+      popupStyle: {left: '0px', top: '0px'},
+      selectedPointId: null,
+      cachedImages: {
+        map: null,
+        marker: null,
+        car: null
+      },
+      imageLoadStatus: {
+        map: false,
+        marker: false,
+        car: false
+      }
+    }
+  },
+  computed: {
+    ...mapGetters(['agvObj'])
+  },
+  mixins: [canvasZoomDrag],
+  mounted () {
+    this.preloadMarkerImage()
+    this.preloadCarImage()
+    this.loadAllDataInParallel()
+    document.addEventListener('click', this.handleDocumentClick)
+    this.carPositionWatcher = this.$watch(
+      () => this.agvObj,
+      (newVal) => {
+        if (newVal && newVal.x !== undefined && newVal.y !== undefined) {
+          this.redrawCanvas()
+        }
+      },
+      { deep: true }
+    )
+  },
+  beforeDestroy () {
+    document.removeEventListener('click', this.handleDocumentClick)
+    if (this.carPositionWatcher) {
+      this.carPositionWatcher()
+    }
+  },
+  methods: {
+    preloadCarImage () {
+      if (this.cachedImages.car) {
+        this.imageLoadStatus.car = true
+        return
+      }
+      const img = new Image()
+      img.src = carImage
+      img.onload = () => {
+        this.cachedImages.car = img
+        this.imageLoadStatus.car = true
+        this.checkImagesLoadedAndRedraw()
+      }
+      img.onerror = () => {
+        console.error('小车图片加载失败')
+        this.imageLoadStatus.car = true
+        this.checkImagesLoadedAndRedraw()
+      }
+    },
+    preloadMarkerImage () {
+      if (this.cachedImages.marker) {
+        this.imageLoadStatus.marker = true
+        return
+      }
+      const img = new Image()
+      img.src = markerImage
+      img.onload = () => {
+        this.cachedImages.marker = img
+        this.imageLoadStatus.marker = true
+        this.checkImagesLoadedAndRedraw()
+      }
+      img.onerror = () => {
+        console.error('标记图片加载失败')
+        this.imageLoadStatus.marker = true
+        this.checkImagesLoadedAndRedraw()
+      }
+    },
+    loadMapImage () {
+      if (!this.mapData.mapImageAddress) {
+        return Promise.reject(new Error('地图数据缺失'))
+      }
+      if (this.cachedImages.map && this.imageLoadStatus.map) {
+        return Promise.resolve(this.cachedImages.map)
+      }
+      return new Promise((resolve, reject) => {
+        const img = new Image()
+        img.src = `${this.$store.getters.baseUrl}${this.mapData.mapImageAddress}`
+        // img.src = this.mapData.mapImageAddress
+        img.onload = () => {
+          this.cachedImages.map = img
+          this.imageLoadStatus.map = true
+          this.checkImagesLoadedAndRedraw()
+          resolve(img)
+        }
+        img.onerror = (error) => {
+          console.error('地图图片加载失败:', error)
+          this.imageLoadStatus.map = true
+          reject(error)
+        }
+      })
+    },
+    checkImagesLoadedAndRedraw () {
+      if (this.imageLoadStatus.map && this.imageLoadStatus.marker && this.imageLoadStatus.car) {
+        this.redrawCanvas()
+      }
+    },
+    async loadAllDataInParallel () {
+      try {
+        this.loading = this.$loading({
+          lock: true,
+          spinner: 'el-icon-loading',
+          background: 'rgba(0, 0, 0, 0.6)'
+        })
+        const [mapData, pathData, stations] = await Promise.all([
+          this._getMapInfoByCode(),
+          this._getRouteInfo(),
+          this._queryMapAllStation()
+        ])
+        this.mapData = mapData
+        this.pathData = [...pathData]
+        this.pointData = this.filterPointData(pathData, stations)
+        this.initCanvas()
+        await this.loadMapImage()
+        this.loading.close()
+      } catch (e) {
+        this.$message.error(`数据加载失败: ${e.message || '未知错误'}`)
+        this.loading.close()
+      }
+    },
+    async _getMapInfoByCode () {
+      try {
+        const res = await getMapInfoByCode()
+        if (!res) throw new Error('地图信息为空')
+        return res
+      } catch (e) {
+        console.error('获取地图信息失败:', e)
+        throw new Error(`获取地图信息失败: ${e.message}`)
+      }
+    },
+    async _getRouteInfo () {
+      try {
+        const res = await getRouteInfo()
+        if (!res) throw new Error('路径信息为空')
+        return res
+      } catch (e) {
+        console.error('获取路径信息失败:', e)
+        throw new Error(`获取路径信息失败: ${e.message}`)
+      }
+    },
+    async _queryMapAllStation () {
+      try {
+        const res = await queryMapAllStation()
+        if (!res) throw new Error('站点信息为空')
+        return res
+      } catch (e) {
+        console.error('获取站点信息失败:', e)
+        throw new Error(`获取站点信息失败: ${e.message}`)
+      }
+    },
+    filterPointData (routes, stations) {
+      const result = []
+      const seenStationIds = new Set()
+      routes.forEach(route => {
+        const startStation = stations.find(s => s.station_id === route.start_id)
+        const endStation = stations.find(s => s.station_id === route.end_id)
+        if (startStation && !seenStationIds.has(startStation.station_id)) {
+          result.push(startStation)
+          seenStationIds.add(startStation.station_id)
+        }
+        if (endStation && !seenStationIds.has(endStation.station_id)) {
+          result.push(endStation)
+          seenStationIds.add(endStation.station_id)
+        }
+      })
+      return result
+    },
+    initCanvas () {
+      this.canvas = this.$refs.mapCanvas
+      this.ctx = this.canvas.getContext('2d')
+      this.canvas.width = this.mapData.width
+      this.canvas.height = this.mapData.height
+      this.redrawCanvas()
+    },
+    redrawCanvas: throttle(function () {
+      if (!this.ctx || !this.mapData) return
+      this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height)
+      this.ctx.save()
+      // 绘制地图背景
+      if (this.cachedImages.map) {
+        this.ctx.drawImage(
+          this.cachedImages.map,
+          0, 0,
+          this.canvas.width,
+          this.canvas.height
+        )
+      } else {
+        this.ctx.fillStyle = '#ccc'
+        this.ctx.fillText('地图加载中...', 50, 50)
+      }
+      this.drawPath()
+      this.drawMarkers()
+      this.drawCar()
+      this.ctx.restore()
+    }, 30),
+    drawPath () {
+      if (!this.pathData.length) return
+      this.ctx.beginPath()
+      this.pathData.forEach((point, index) => {
+        const startX = (point.start_x - this.mapData.x) / this.mapData.resolution
+        const startY = this.mapData.height - (point.start_y - this.mapData.y) / this.mapData.resolution
+        const endX = (point.end_x - this.mapData.x) / this.mapData.resolution
+        const endY = this.mapData.height - (point.end_y - this.mapData.y) / this.mapData.resolution
+        this.ctx.moveTo(startX, startY)
+        this.ctx.lineTo(endX, endY)
+      })
+      this.ctx.strokeStyle = '#009de5'
+      this.ctx.lineWidth = 2
+      this.ctx.stroke()
+    },
+    drawMarkers () {
+      if (!this.pointData.length) return
+      const markerSize = 10 // 标记大小随缩放变化
+      this.pointData.forEach(point => {
+        const x = (point.x - this.mapData.x) / this.mapData.resolution
+        const y = this.mapData.height - (point.y - this.mapData.y) / this.mapData.resolution
+        // 绘制选中状态
+        if (point.station_id === this.selectedPointId) {
+          this.ctx.beginPath()
+          this.ctx.arc(x, y, 5, 0, Math.PI * 2)
+          this.ctx.fillStyle = '#59ccd2'
+          this.ctx.fill()
+        } else if (this.cachedImages.marker) {
+          this.ctx.drawImage(
+            this.cachedImages.marker,
+            x - markerSize / 2, // 居中对齐
+            y - markerSize / 2,
+            markerSize,
+            markerSize
+          )
+        }
+        // 绘制点位名称（文字大小随缩放变化）
+        this.ctx.font = '12px Arial'
+        this.ctx.fillStyle = 'white'
+        this.ctx.textAlign = 'center'
+        this.ctx.fillText(point.station_name, x, y + 18)
+      })
+    },
+    drawCar () {
+      console.log(this.$store.getters.agvObj)
+      if (!this.agvObj || !this.cachedImages.car || !this.mapData) return
+      const carX = (this.agvObj.x - this.mapData.x) / this.mapData.resolution
+      const carY = this.mapData.height - (this.agvObj.y - this.mapData.y) / this.mapData.resolution
+      this.ctx.drawImage(
+        this.cachedImages.car,
+        carX - 35,
+        carY - 21,
+        70,
+        42
+      )
+    },
+    handleCanvasClick (event) {
+      const rect = this.canvas.getBoundingClientRect()
+      const mouseX = (event.clientX - rect.left) / this.scale
+      const mouseY = (event.clientY - rect.top) / this.scale
+      this.pointData.forEach(point => {
+        let x = (point.x - this.mapData.x) / this.mapData.resolution
+        let y = this.mapData.height - (point.y - this.mapData.y) / this.mapData.resolution
+        x = Math.abs(x) === 0 ? 0 : x
+        y = Math.abs(y) === 0 ? 0 : y
+        // 检查点击位置是否在标记图片内
+        if (mouseX >= x - 10 && mouseX <= x + 10 && mouseY >= y - 10 && mouseY <= y + 10) {
+          this.handlePointSelect(point, event)
+          event.stopPropagation()
+        }
+      })
+    },
+    handlePointSelect (point, event) {
+      if (this.selectedPointId === point.station_id) {
+        this.resetSelection()
+      } else {
+        this.selectedPointId = point.station_id
+        this.selectedPoint = point
+        this.showPopup = true
+        this.calculatePopupPosition(event)
+        this.redrawCanvas()
+      }
+    },
+    calculatePopupPosition (event) {
+      const popupWidth = 200
+      const popupHeight = 180
+      let left = event.clientX - 40
+      let top = event.clientY - 150
+
+      // 限制弹窗在窗口可视范围内
+      left = Math.max(10, Math.min(left, window.innerWidth - popupWidth - 10))
+      top = Math.max(10, Math.min(top, window.innerHeight - popupHeight - 10))
+
+      this.popupStyle = { left: `${left}px`, top: `${top}px` }
+    },
+    handleDocumentClick () {
+      this.resetSelection()
+    },
+    resetSelection () {
+      if (this.selectedPointId) {
+        this.selectedPointId = null
+        this.selectedPoint = null
+        this.showPopup = false
+        this.redrawCanvas()
+      }
+    }
+  }
+}
+</script>
+
+<style lang="stylus" scoped>
+.canvas-container
+  position relative
+  display flex
+  justify-content: center;
+  align-items: center;
+  height calc(100% - .32rem)
+  background-color rgba(4, 33, 58, 70%)
+  box-shadow inset 1px 1px 7px 2px #4d9bcd
+  overflow hidden
+.map_tools
+  position absolute
+  top 0
+  right 0
+.zoom_data
+  width .6rem
+  font-size .16rem
+  height .32rem
+  line-height .32rem
+  color #00d9f3
+  text-align center
+  border-top 1px solid #009fde
+  border-bottom 1px solid #009fde
+.point-popup
+  position fixed
+  background rgba(0, 0, 0, 70%)
+  border 1px solid rgba(255, 255, 255, .3)
+  border-radius: 8px;
+  padding 10px
+  box-shadow 0 0px 4px 2px rgba(255,255,255,0.1)
+  z-index 100
+  min-width 150px
+  animation fadeIn 0.2s ease-out
+  h3
+    color #fff
+    font-size 14px
+    line-height 24px
+    text-align center
+  p
+    color #fff
+    font-size 14px
+    line-height 24px
+    text-align center
+@keyframes fadeIn {
+  from { opacity: 0; transform: translateY(5px); }
+  to { opacity: 1; transform: translateY(0); }
+}
+</style>