feat: 优化矢量缩放频率

src/core/components/arrow/temp-arrow.vue

@@ -9,7 +9,7 @@
         hitFunc: hitFunc,
         stroke: data.fill,
         fill: data.fill,
-        hitStrokeWidth: data.strokeWidth + (data.fixed ? 10 * inv.scaleX : 10),
+        hitStrokeWidth: data.strokeWidth + (data.fixed ? 10 * scale : 10),
         pointerWidth: data.pointerLength,
         closed: false,
         id: void 0,
@@ -47,7 +47,7 @@
       >
         <Point
           v-for="(_, ndx) in data.points"
-          :size="data.strokeWidth + (data.fixed ? 6 * inv.scaleX : 6)"
+          :size="data.strokeWidth + (data.fixed ? 6 * scale : 6)"
           :points="data.points"
           :ndx="ndx"
           :closed="false"
@@ -86,7 +86,7 @@ import { Group } from "konva/lib/Group";
 import { useConfig } from "@/core/hook/use-config.ts";
 import { useMouseShapeStatus } from "@/core/hook/use-mouse-status.ts";
 import { useOperMode } from "@/core/hook/use-status.ts";
-import { useViewerInvertTransformConfig } from "@/core/hook/use-viewer.ts";
+import { useFixedScale, useViewerInvertTransformConfig } from "@/core/hook/use-viewer.ts";
 
 const props = defineProps<{ data: ArrowData; canEdit?: boolean; addMode?: boolean }>();
 const emit = defineEmits<{
@@ -98,7 +98,7 @@ const emit = defineEmits<{
 
 const shape = ref<DC<Group>>();
 const config = useConfig();
-const inv = useViewerInvertTransformConfig();
+const scale = useFixedScale();
 
 const data = computed(() => {
   const style = {
@@ -106,10 +106,10 @@ const data = computed(() => {
     ...props.data,
   };
   style.pointerLength = props.data.fixed
-    ? style.pointerLength * inv.value.scaleX
+    ? style.pointerLength * scale.value
     : style.pointerLength;
   style.strokeWidth = props.data.fixed
-    ? style.strokeWidth * inv.value.scaleX
+    ? style.strokeWidth * scale.value
     : style.strokeWidth;
   return style;
 });

src/core/components/circle/temp-circle.vue

@@ -53,7 +53,7 @@ import { DC } from "@/deconstruction.js";
 import { Circle } from "konva/lib/shapes/Circle";
 import { Transform } from "konva/lib/Util";
 import { useConfig } from "@/core/hook/use-config.ts";
-import { useViewerInvertTransformConfig } from "@/core/hook/use-viewer.ts";
+import { useFixedScale, useViewerInvertTransformConfig } from "@/core/hook/use-viewer.ts";
 
 const props = defineProps<{ data: CircleData; addMode?: boolean; editer?: boolean }>();
 const emit = defineEmits<{
@@ -62,14 +62,14 @@ const emit = defineEmits<{
 }>();
 
 const config = useConfig();
-const inv = useViewerInvertTransformConfig();
+const scale = useFixedScale()
 const data = computed(() => {
   const style = {
     ...defaultStyle,
     ...props.data,
   };
   if (style.fixed) {
-    style.strokeWidth *= inv.value.scaleX;
+    style.strokeWidth *= scale.value;
   }
   return style;
 });

src/core/components/line/renderer/wall/index.vue

@@ -27,13 +27,13 @@
 </template>
 
 <script lang="ts" setup>
-import { computed } from "vue";
+import { computed, watch, watchEffect } from "vue";
 import { useGetDiffLineIconPolygons, useGetExtendPolygon } from "./view";
 import { LineData, LineDataLine } from "../..";
 import { getLinePoints } from "../../attach-server";
 import { flatPositions } from "@/utils/shared";
 import SizeLine from "../../../share/size-line.vue";
-import { useViewerInvertTransformConfig } from "@/core/hook/use-viewer";
+import { useFixedScale } from "@/core/hook/use-viewer";
 
 const props = defineProps<{
   getShapeAttrib: ReturnType<typeof useGetExtendPolygon>;
@@ -48,6 +48,6 @@ const polygon = computed(() => props.getShapeAttrib(props.line));
 const points = computed(() => getLinePoints(props.data, props.line));
 const gd = useGetDiffLineIconPolygons(props.line, points);
 const polygons = computed(() => gd.diff(polygon.value));
-const inv = useViewerInvertTransformConfig();
-const strokeWidth = computed(() => (props.line.fixed ? inv.value.scaleX * 1 : 1));
+const scale = useFixedScale();
+const strokeWidth = computed(() => (props.line.fixed ? scale.value * 1 : 1));
 </script>

src/core/components/line/renderer/wall/view.ts

@@ -6,7 +6,6 @@ import {
   getLineEdges,
   LEJInfo,
   LEJLine,
-  lineLen,
   lineVector,
   Pos,
   verticalVector,
@@ -20,10 +19,7 @@ import { computed, nextTick, reactive, Ref, watch } from "vue";
 import { getLineIconEndpoints } from "../../../line-icon";
 import { useDrawIngData } from "@/core/hook/use-draw";
 import { polygonDifference, polygonDifferenceOnly } from "@/utils/math-clip";
-import {
-  useViewerInvertTransform,
-  useViewerInvertTransformConfig,
-} from "@/core/hook/use-viewer";
+import { useFixedScale } from "@/core/hook/use-viewer";
 
 export const useGetExtendPolygon = (lineData: Ref<LineData | undefined>) => {
   const minAngle = MathUtils.degToRad(0.1);
@@ -32,9 +28,9 @@ export const useGetExtendPolygon = (lineData: Ref<LineData | undefined>) => {
   type JInfo = { lej: LEJInfo | undefined; diffPolygons?: Pos[][] };
   const joinInfos = reactive({}) as Record<string, Record<string, JInfo>>;
 
-  const inv = useViewerInvertTransformConfig();
+  const scale = useFixedScale();
   const getWidth = (width: number, fixed: boolean) =>
-    fixed ? width * inv.value.scaleX : width;
+    fixed ? width * scale.value : width;
 
   const getInfoKey = (line: LEJLine) =>
     line.points.reduce((t, p) => round(p.x, 3) + round(p.y, 3) + t, "") +
@@ -47,11 +43,11 @@ export const useGetExtendPolygon = (lineData: Ref<LineData | undefined>) => {
   ) => {
     const origin = {
       points: getLinePoints(data, originLine),
-      width: getWidth(originLine.strokeWidth, originLine.fixed)
+      width: getWidth(originLine.strokeWidth, originLine.fixed),
     };
     const target = {
       points: getLinePoints(data, targetLine),
-      width: getWidth(targetLine.strokeWidth, targetLine.fixed)
+      width: getWidth(targetLine.strokeWidth, targetLine.fixed),
     };
     const { originNdx } = getLEJJoinNdxs(origin.points, target.points);
     const lej = getLineEdgeJoinInfo(origin, target, minAngle, palAngle);
@@ -69,7 +65,7 @@ export const useGetExtendPolygon = (lineData: Ref<LineData | undefined>) => {
   const getLEJPolygon = (data: LineData, originLine: LineDataLine) => {
     const origin = {
       points: getLinePoints(data, originLine),
-      width: getWidth(originLine.strokeWidth, originLine.fixed)
+      width: getWidth(originLine.strokeWidth, originLine.fixed),
     };
     if (!origin.points[0] || !origin.points[1]) return [];
     const key = getInfoKey(origin);
@@ -149,7 +145,7 @@ export const useGetExtendPolygon = (lineData: Ref<LineData | undefined>) => {
       } else {
         const key = getInfoKey({
           points: getLinePoints(data, lines[0]),
-          width: getWidth(lines[0].strokeWidth, lines[0].fixed)
+          width: getWidth(lines[0].strokeWidth, lines[0].fixed),
         });
         if (!(key in joinInfos)) {
           joinInfos[key] = {};
@@ -165,7 +161,7 @@ export const useGetExtendPolygon = (lineData: Ref<LineData | undefined>) => {
 
   const genLEJLine = (lineData: LineData, line: LineDataLine) => ({
     points: getLinePoints(lineData, line),
-    width: getWidth(line.strokeWidth, line.fixed)
+    width: getWidth(line.strokeWidth, line.fixed),
   });
 
   const init = (data: LineData) => {
@@ -363,12 +359,15 @@ export const useGetDiffLineIconPolygons = (
     });
   });
 
-  const inv = useViewerInvertTransformConfig()
-  const getWidth = (line: LineDataLine) => line.fixed ? line.strokeWidth * inv.value.scaleX : line.strokeWidth
+  const scale = useFixedScale();
+  const width = computed(() =>
+    line.fixed ? line.strokeWidth * scale.value : line.strokeWidth
+  );
+
   const interPolygons = computed(() => {
     return interLines.value.map((il) => {
       const interLine = il.points;
-      const topOffset = linevv.value.clone().multiplyScalar(getWidth(line));
+      const topOffset = linevv.value.clone().multiplyScalar(width.value);
       const botOffset = topOffset.clone().multiplyScalar(-1);
       return [
         topOffset.clone().add(interLine[0]),
@@ -381,9 +380,6 @@ export const useGetDiffLineIconPolygons = (
 
   return {
     diff: (polygon: Pos[]) => {
-      if (interPolygons.value.length) {
-        console.log(polygonDifference(polygon, interPolygons.value))
-      }
       const result = interPolygons.value.length
         ? polygonDifference(polygon, interPolygons.value)
         : [polygon];

src/core/components/line/single-line.vue

@@ -162,9 +162,7 @@ const { drawProps, enter: enterDrawLinePoint } = useDrawLinePoint(
 );
 
 const drawData = computed(() => drawProps.value?.data);
-const drawGetShapeAttrib = computed(
-  () => renderer.value && renderer.value.genGetShapeAttrib(drawData)
-);
+const drawGetShapeAttrib = renderer.value!.genGetShapeAttrib(drawData)
 const menus = [
   { label: "加点", handler: enterDrawLinePoint },
   { label: "删除", handler: delHandler },

src/core/components/line/temp-line.vue

@@ -78,9 +78,7 @@ const data = computed(() => {
   if (!initData.value || props.addMode) return props.data;
   return initData.value;
 });
-const getShapeAttrib = computed(
-  () => renderer.value && renderer.value.genGetShapeAttrib(data)
-);
+const getShapeAttrib = renderer.value!.genGetShapeAttrib(data);
 
 const dragPointIds = ref<string[]>();
 let track = false;

src/core/components/polygon/temp-polygon.vue

@@ -45,7 +45,7 @@ import { DC } from "@/deconstruction.js";
 import { Line } from "konva/lib/shapes/Line";
 import { Pos } from "@/utils/math.ts";
 import { useConfig } from "@/core/hook/use-config.ts";
-import { useViewerInvertTransformConfig } from "@/core/hook/use-viewer.ts";
+import { useFixedScale } from "@/core/hook/use-viewer.ts";
 const props = defineProps<{ data: PolygonData; canEdit?: boolean; addMode?: boolean }>();
 const emit = defineEmits<{
   (e: "update:position", data: { ndx: number; val: Pos }): void;
@@ -54,14 +54,14 @@ const emit = defineEmits<{
   (e: "deletePoint", ndx: number): void;
 }>();
 
-const inv = useViewerInvertTransformConfig();
+const scale = useFixedScale();
 const data = computed(() => {
   const style = {
     ...defaultStyle,
     ...props.data,
   };
   if (style.fixed) {
-    style.strokeWidth *= inv.value.scaleX;
+    style.strokeWidth *= scale.value;
   }
   return style;
 });

src/core/components/rectangle/temp-rectangle.vue

@@ -39,7 +39,7 @@ import { Line } from "konva/lib/shapes/Line";
 import { Transform } from "konva/lib/Util";
 import { MathUtils } from "three";
 import { useConfig } from "@/core/hook/use-config.ts";
-import { useViewerInvertTransformConfig } from "@/core/hook/use-viewer.ts";
+import { useFixedScale, useViewerInvertTransformConfig } from "@/core/hook/use-viewer.ts";
 
 const props = defineProps<{ data: RectangleData; addMode?: boolean; editer?: boolean }>();
 const emit = defineEmits<{
@@ -48,14 +48,14 @@ const emit = defineEmits<{
 }>();
 
 const config = useConfig();
-const inv = useViewerInvertTransformConfig();
+const scale = useFixedScale();
 const data = computed(() => {
   const style = {
     ...defaultStyle,
     ...props.data,
   };
   if (style.fixed) {
-    style.strokeWidth *= inv.value.scaleX;
+    style.strokeWidth *= scale.value;
   }
   return style;
 });

src/core/components/share/edit-line.vue

@@ -39,13 +39,18 @@ import { generateSnapInfos } from "../util";
 import { getMouseColors } from "@/utils/colors";
 import { themeColor } from "@/constant";
 import { Circle } from "konva/lib/shapes/Circle";
-import { useViewer, useViewerInvertTransformConfig } from "@/core/hook/use-viewer";
+import {
+  useFixedScale,
+  useViewer,
+  useViewerInvertTransformConfig,
+} from "@/core/hook/use-viewer";
 import { useMode } from "@/core/hook/use-status";
 import { Mode } from "@/constant/mode";
 import { LineDataLine } from "../line";
 
-type LData = Pick<LineDataLine, "strokeWidth" | "stroke"> & {fixed?: boolean};
-const inv = useViewerInvertTransformConfig();
+type LData = Pick<LineDataLine, "strokeWidth" | "stroke"> & { fixed?: boolean };
+
+const scale = useFixedScale();
 const props = defineProps<{
   data: LData;
   points: Pos[];
@@ -164,7 +169,7 @@ useShapeClick(point, () => {
 });
 const center = computed(() => lineCenter(points.value));
 const width = computed(() =>
-  props.data.fixed ? props.data.strokeWidth * inv.value.scaleX : props.data.strokeWidth
+  props.data.fixed ? props.data.strokeWidth * scale.value : props.data.strokeWidth
 );
 const pointStyle = computed(() => {
   const color = getMouseColors(props.data.stroke || themeColor);

src/core/components/share/edit-point.vue

@@ -30,7 +30,11 @@ import { useShapeIsHover } from "@/core/hook/use-mouse-status";
 import { useCursor } from "@/core/hook/use-global-vars";
 import { mergeFuns, rangMod } from "@/utils/shared";
 import { Operate } from "../../html-mount/propertys/index.ts";
-import { useViewer, useViewerInvertTransformConfig } from "@/core/hook/use-viewer.ts";
+import {
+  useFixedScale,
+  useViewer,
+  useViewerInvertTransformConfig,
+} from "@/core/hook/use-viewer.ts";
 import { useMode } from "@/core/hook/use-status";
 import { Mode } from "@/constant/mode";
 
@@ -56,12 +60,12 @@ const emit = defineEmits<{
 }>();
 
 const position = computed(() => props.points[props.ndx]);
-const inv = useViewerInvertTransformConfig();
+const scale = useFixedScale();
 const viewer = useViewer();
 const style = computed(() => {
   const color = getMouseColors(props.color || themeColor);
   let size = props.size || 5;
-  size = props.fixed ? inv.value.scaleX * size : size;
+  size = props.fixed ? scale.value * size : size;
 
   return {
     radius: size / 2,

src/core/components/share/size-line.vue

@@ -36,7 +36,7 @@ import {
 import { flatPositions } from "@/utils/shared";
 import { useProportion } from "@/core/hook/use-proportion";
 import { TextPathConfig } from "konva/lib/shapes/TextPath";
-import { useViewerInvertTransformConfig } from "@/core/hook/use-viewer";
+import { useFixedScale, useViewerInvertTransformConfig } from "@/core/hook/use-viewer";
 
 const props = withDefaults(
   defineProps<{
@@ -48,8 +48,8 @@ const props = withDefaults(
   }>(),
   { stroke: "#999", strokeWidth: 1 }
 );
-const inv = useViewerInvertTransformConfig();
-const scale = computed(() => (props.fixed ? inv.value.scaleX : 1));
+const fscale = useFixedScale();
+const scale = computed(() => (props.fixed ? fscale.value : 1));
 const style = computed(() => ({ stroke: props.stroke, strokeWidth: 10 * scale.value }));
 const fontSize = computed(() => 10 * scale.value + style.value.strokeWidth * 2);
 const len = computed(() =>

src/core/components/triangle/temp-triangle.vue

@@ -40,20 +40,20 @@ import { Transform } from "konva/lib/Util";
 import { MathUtils } from "three";
 import { lineSpeed } from "@/utils/math.ts";
 import { useConfig } from "@/core/hook/use-config.ts";
-import { useViewerInvertTransformConfig } from "@/core/hook/use-viewer.ts";
+import { useFixedScale } from "@/core/hook/use-viewer.ts";
 const props = defineProps<{ data: TriangleData; addMode?: boolean; editer?: boolean }>();
 const emit = defineEmits<{
   (e: "updateContent", data: string): void;
   (e: "update:isEdit", data: boolean): void;
 }>();
-const inv = useViewerInvertTransformConfig();
+const fscale = useFixedScale();
 const data = computed(() => {
   const style = {
     ...defaultStyle,
     ...props.data,
   };
   if (style.fixed) {
-    style.strokeWidth *= inv.value.scaleX;
+    style.strokeWidth *= fscale.value;
   }
   return style;
 });

src/core/helper/split-line.vue

@@ -29,6 +29,7 @@ import { computed, onUnmounted } from "vue";
 import { components } from "../components";
 import { useComponentsAttach } from "../hook/use-component";
 import {
+  useFixedScale,
   useGetViewBoxPositionPixel,
   useViewerInvertTransformConfig,
   useViewerTransform,
@@ -169,7 +170,8 @@ const rectAxisSteps = computed(() => {
 
 const { transform } = useProportion();
 const getWidthText = (val: number) => Math.round(transform(val)).toString();
-const invConfig = useViewerInvertTransformConfig();
+
+const fscale = useFixedScale();
 const axissInfo = computed(() => {
   if (!rang.value) return;
   const infos: Record<string, { points: number[]; texts: TextConfig[] }> = {
@@ -203,7 +205,7 @@ const axissInfo = computed(() => {
 
       infos.left.texts.push({
         width: width,
-        text: getWidthText(width * invConfig.value.scaleY),
+        text: getWidthText(width * fscale.value),
         ...tf.decompose(),
       });
     }
@@ -233,7 +235,7 @@ const axissInfo = computed(() => {
 
       infos.right.texts.push({
         width: width,
-        text: getWidthText(width * invConfig.value.scaleY).toString(),
+        text: getWidthText(width * fscale.value).toString(),
         ...tf.decompose(),
       });
     }
@@ -256,7 +258,7 @@ const axissInfo = computed(() => {
       const width = cur - prev;
       infos.top.texts.push({
         width: width,
-        text: getWidthText(width * invConfig.value.scaleX).toString(),
+        text: getWidthText(width * fscale.value).toString(),
         ...lt,
       });
     }
@@ -279,7 +281,7 @@ const axissInfo = computed(() => {
       const width = cur - prev;
       infos.bottom.texts.push({
         width: width,
-        text: getWidthText(width * invConfig.value.scaleX).toString(),
+        text: getWidthText(width * fscale.value).toString(),
         ...lt,
       });
     }

src/core/hook/use-selection.ts

@@ -29,6 +29,7 @@ import {
 import { EntityShape } from "@/deconstruction";
 import { Util } from "konva/lib/Util";
 import {
+  useFixedScale,
   useViewerInvertTransform,
   useViewerInvertTransformConfig,
 } from "./use-viewer";
@@ -176,7 +177,7 @@ export const useShapesIcon = (
     ...args,
     listening: false,
   };
-  const invConfig = useViewerInvertTransformConfig();
+  const fScale = useFixedScale()
   const invMat = useViewerInvertTransform();
   const getShapeMat = (shape: EntityShape) => {
     const rect = shape.getClientRect();
@@ -200,13 +201,13 @@ export const useShapesIcon = (
         const mat = ref(getShapeMat(addShape));
         const data = reactive({ ...iconProps, mat: mat });
         const update = frameEebounce(() => {
-          data.width = invConfig.value.scaleX * iconProps.width;
-          data.height = invConfig.value.scaleY * iconProps.height;
+          data.width = fScale.value * iconProps.width;
+          data.height = fScale.value * iconProps.height;
           mat.value = getShapeMat(addShape);
         });
         const unHooks = [
           on(addShape, update),
-          watch(invConfig, update, { immediate: true, flush: "post" }),
+          watch(fScale, update, { immediate: true, flush: "post" }),
           mParts.add({
             comp: markRaw(Icon),
             props: { data },

src/core/hook/use-viewer.ts

@@ -3,7 +3,7 @@ import { computed, nextTick, ref, watch, watchEffect } from "vue";
 import { dragListener, scaleListener } from "../../utils/event.ts";
 import { globalWatch, installGlobalVar, useStage } from "./use-global-vars.ts";
 import { useCan } from "./use-status";
-import { mergeFuns } from "../../utils/shared.ts";
+import { frameEebounce, mergeFuns } from "../../utils/shared.ts";
 import { Transform } from "konva/lib/Util";
 import { lineLen } from "@/utils/math.ts";
 import { useResize } from "./use-event.ts";
@@ -99,6 +99,18 @@ export const useViewerInvertTransformConfig = () => {
   return computed(() => transform.value.decompose());
 };
 
+export const useFixedScale = () => {
+  const inv = useViewerInvertTransformConfig()
+  const scale = ref(inv.value.scaleX)
+  watch(inv, frameEebounce((inv) => {
+    const newScale = inv.scaleX
+    // if (Math.abs(newScale - scale.value) > 0.05) {
+      scale.value = newScale
+    // }
+  }))
+  return scale
+}
+
 export const useUnitTransform = installGlobalVar(() => {
   const transform = useViewerTransform();
   const invTransform = useViewerInvertTransform();

src/example/components/slide/actions.ts

@@ -1,7 +1,11 @@
 import { DrawItem, shapeNames, ShapeType } from "@/index";
 import { defaultStyle } from "@/core/components/image/index";
 import { v4 as uuid } from "uuid";
-import { getMapInfo, SelectMapImageProps } from "../../dialog/basemap/index";
+import {
+  getMapInfo,
+  SelectMapImageProps,
+  TileGroup,
+} from "../../dialog/basemap/index";
 import { selectAI } from "../../dialog/ai";
 import { drawPlatformResource } from "../../platform/platform-draw";
 import { selectFile } from "@/utils/dom";
@@ -10,11 +14,12 @@ import { Draw } from "../container/use-draw";
 import { MenuItem } from "./menu";
 import { copy } from "@/utils/shared";
 import { ElMessage } from "element-plus";
-import { getRealPixel } from "@/example/fuse/views/tabulation/gen-tab";
 import { nextTick, ref } from "vue";
 import { Rect } from "konva/lib/shapes/Rect";
 import { Size } from "@/utils/math";
 import { getBaseItem } from "@/core/components/util";
+import { loading } from "@/example/loadding";
+import { getImageSize } from "@/utils/shape";
 
 export type PresetAdd<T extends ShapeType = ShapeType> = {
   type: T;
@@ -80,6 +85,36 @@ export const imp: MenuItem = {
     },
     {
       value: uuid(),
+      icon: "map",
+      name: "地图",
+      handler: async (draw: Draw) => {
+        const tileGroups = (await loading(
+          window.platform.getTileGroups()
+        )) as TileGroup[];
+        const result = await selectMap({
+          search: window.platform.searchAddress,
+          activeGroupIndex: 0,
+          tileGroups,
+        });
+        const realSize = result.info.size;
+        const imageSize = await getImageSize(result.url);
+        const scale = realSize.width / imageSize.width;
+
+        ElMessage.warning("请在画图面板中选择放置位置，鼠标右键取消");
+        draw.enterDrawShape(
+          "image",
+          {
+            width: realSize.width,
+            height: realSize.height,
+            url: result.url,
+          },
+          true
+        );
+        // emit("updateMapImage", { url: result.url, size: result.info.size });
+      },
+    },
+    {
+      value: uuid(),
       icon: "local_i",
       name: "本地",
       handler: async (draw: Draw) => {
@@ -118,7 +153,6 @@ export const getPaperConfig = (p: number[], scale: number) => {
   const pad = 5 * scale;
   const size = { width: p[0] * scale, height: p[1] * scale };
   const margin = [pad, pad, pad, pad * 5];
-  const a = getRealPixel(5, "a4");
   return { size, margin };
 };
 export const paperConfigs = {

src/example/dialog/basemap/leaflet/index.vue

@@ -166,13 +166,17 @@ const submit = async (): Promise<BasemapInfo> => {
   const bound = lMap.value.getBounds();
   const southWest = bound.getSouthWest(); // 西南角
   const northEast = bound.getNorthEast(); // 东北角
+
+  // 修正：计算宽度应该使用相同的纬度
   const width = lMap.value.distance(
-    [southWest.lng, northEast.lat],
-    [northEast.lng, northEast.lat]
+    [southWest.lat, southWest.lng], // 西南角
+    [southWest.lat, northEast.lng] // 同纬度，经度不同
   );
+
+  // 修正：计算高度应该使用相同的经度
   const height = lMap.value.distance(
-    [northEast.lng, southWest.lat],
-    [northEast.lng, northEast.lat]
+    [southWest.lat, southWest.lng], // 西南角
+    [northEast.lat, southWest.lng] // 同经度，纬度不同
   );
 
   let blob: Blob;