#
Junjie
4 天以前 be1cd9e5b30097ca427a9c2b7b054b28854e410a
src/main/webapp/components/MapCanvas.js
@@ -26,6 +26,7 @@
        <div v-show="showMapToolPanel" :style="mapToolBarStyle()">
          <div :style="mapToolRowStyle()">
            <button type="button" @click="toggleStationDirection" :style="mapToolButtonStyle(showStationDirection)">{{ showStationDirection ? '隐藏站点方向' : '显示站点方向' }}</button>
            <button type="button" @click="resetMapView" :style="mapToolButtonStyle(false)">重置视图</button>
            <button type="button" @click="rotateMap" :style="mapToolButtonStyle(false)">旋转</button>
            <button type="button" @click="toggleMirror" :style="mapToolButtonStyle(mapMirrorX)">{{ mapMirrorX ? '取消镜像' : '镜像' }}</button>
          </div>
@@ -118,6 +119,7 @@
      },
      shelfTooltipMinScale: 0.4,
      containerResizeObserver: null,
      resizeDebounceTimer: null,
      timer: null,
      adjustLabelTimer: null,
      isSwitchingFloor: false,
@@ -154,7 +156,7 @@
    this.loadStationColorConfig();
    this.loadLocList();
    this.connectWs();
    setTimeout(() => {
      this.getMap(this.currentLev);
    }, 1000);
@@ -172,10 +174,11 @@
    if (this.hoverRaf) { cancelAnimationFrame(this.hoverRaf); this.hoverRaf = null; }
    if (this.shelfCullRaf) { cancelAnimationFrame(this.shelfCullRaf); this.shelfCullRaf = null; }
    if (this.resizeDebounceTimer) { clearTimeout(this.resizeDebounceTimer); this.resizeDebounceTimer = null; }
    if (window.gsap && this.pixiApp && this.pixiApp.stage) { window.gsap.killTweensOf(this.pixiApp.stage.position); }
    if (this.pixiApp) { this.pixiApp.destroy(true, { children: true }); }
    if (this.containerResizeObserver) { this.containerResizeObserver.disconnect(); this.containerResizeObserver = null; }
    window.removeEventListener('resize', this.resizeToContainer);
    window.removeEventListener('resize', this.scheduleResizeToContainer);
    if (this.wsReconnectTimer) { clearTimeout(this.wsReconnectTimer); this.wsReconnectTimer = null; }
    if (this.ws && (this.ws.readyState === WebSocket.OPEN || this.ws.readyState === WebSocket.CONNECTING)) { try { this.ws.close(); } catch (e) {} }
  },
@@ -376,7 +379,7 @@
      this.pixiApp.view.style.height = '100%';
      this.pixiApp.view.style.display = 'block';
      this.resizeToContainer();
      window.addEventListener('resize', this.resizeToContainer);
      window.addEventListener('resize', this.scheduleResizeToContainer);
      this.graphicsCrnTrack = this.createTrackTexture(25, 25, 10);
      this.graphicsRgvTrack = this.createTrackTexture(25, 25, 10);
      this.objectsContainer = new PIXI.Container();
@@ -489,9 +492,18 @@
    startContainerResizeObserve() {
      if (typeof ResizeObserver === 'undefined' || !this.$el) { return; }
      this.containerResizeObserver = new ResizeObserver(() => {
        this.resizeToContainer();
        this.scheduleResizeToContainer();
      });
      this.containerResizeObserver.observe(this.$el);
    },
    scheduleResizeToContainer() {
      if (this.resizeDebounceTimer) {
        clearTimeout(this.resizeDebounceTimer);
      }
      this.resizeDebounceTimer = setTimeout(() => {
        this.resizeDebounceTimer = null;
        this.resizeToContainer();
      }, 80);
    },
    getViewportSize() {
      if (!this.pixiApp || !this.pixiApp.renderer) { return { width: 0, height: 0 }; }
@@ -2408,6 +2420,11 @@
      this.applyMapTransform(true);
      this.saveMapTransformConfig();
    },
    resetMapView() {
      this.fitStageToContent();
      this.scheduleAdjustLabels();
      this.scheduleShelfChunkCulling();
    },
    toggleStationDirection() {
      this.showStationDirection = !this.showStationDirection;
      this.applyStationDirectionVisibility();
@@ -2640,13 +2657,6 @@
    }
  }
});