#

Junjie

4 天以前 f89d2b774175f3dc0cf12967c274974d4d164615

 src/main/webapp/views/locMap/locMap.html

@@ -355,29 +355,16 @@
        pixiApp.view.addEventListener('wheel', (event) => {
          event.stopPropagation();
          event.preventDefault();
          // 因为画布是充满视窗的，所以clientX等于mouse point在renderer上的x坐标
          const globalPos = [event.clientX, event.clientY];
          const delta = event.deltaY;
          const sx = event.clientX;
          const sy = event.clientY;
          const oldZoom = pixiApp.stage.scale.x;
          const delta = event.deltaY;
          let newZoom = oldZoom * 0.999 ** delta;

          // const oldStageMatrix = app.stage.localTransform.clone();
          // const oldStagePos = oldStageMatrix.applyInverse(pointerGlobalPos);
          const oldStagePos = globalPos;
          const dx = oldStagePos[0] * oldZoom - oldStagePos[0] * newZoom;
          const dy = oldStagePos[1] * oldZoom - oldStagePos[1] * newZoom;

          pixiApp.stage.setTransform(
                  pixiApp.stage.position.x + dx,
                  pixiApp.stage.position.y + dy,
                  newZoom,
                  newZoom,
                  0,
                  0,
                  0,
                  0,
                  0
          );
          const worldX = (sx - pixiApp.stage.position.x) / oldZoom;
          const worldY = (sy - pixiApp.stage.position.y) / oldZoom;
          const newPosX = sx - worldX * newZoom;
          const newPosY = sy - worldY * newZoom;
          pixiApp.stage.setTransform(newPosX, newPosY, newZoom, newZoom, 0, 0, 0, 0, 0);

        });
        //*******************缩放画布*******************
@@ -462,10 +449,21 @@
            }
          });

          //视角居中
          let containerWidth = (pixiApp.view.width - objectsContainer.width) / 2;
          let containerHeight = (pixiApp.view.height - objectsContainer.height) / 2;
          pixiApp.stage.position.set(containerWidth, containerHeight);
          const b1 = objectsContainer.getLocalBounds();
          const b2 = objectsContainer2.getLocalBounds();
          const minX = Math.min(b1.x, b2.x);
          const minY = Math.min(b1.y, b2.y);
          const maxX = Math.max(b1.x + b1.width, b2.x + b2.width);
          const maxY = Math.max(b1.y + b1.height, b2.y + b2.height);
          const contentW = Math.max(0, maxX - minX);
          const contentH = Math.max(0, maxY - minY);
          const vw = pixiApp.view.width;
          const vh = pixiApp.view.height;
          let scale = Math.min(vw / contentW, vh / contentH) * 0.95;
          if (!isFinite(scale) || scale <= 0) { scale = 1; }
          const posX = (vw - contentW * scale) / 2 - minX * scale;
          const posY = (vh - contentH * scale) / 2 - minY * scale;
          pixiApp.stage.setTransform(posX, posY, scale, scale, 0, 0, 0, 0, 0);
        }else {
          let diff = this.findDiffList(this.map, map);
          diff.forEach((item, index) => {