Merge branch 'ga-2.1.0' into v1.3.0

src/components/icon/icon.vue

@@ -9,9 +9,11 @@
         fill: computedColor,
         display: 'inline-block',
         verticalAlign: 'middle',
+        strokeWidth: strokeWidth + 'px',
       }"
       :width="computedSize"
       :height="computedSize"
+      ref="svg"
     >
       <use :xlink:href="`#icon-${name}`" />
     </svg>
@@ -19,10 +21,36 @@
 </template>
 
 <script lang="ts" setup>
-import { computed } from "vue";
+import { computed, ref, watch, watchEffect } from "vue";
 
-const props = defineProps<{ name: string; size?: string; color?: string }>();
+const props = defineProps<{
+  name: string;
+  percentage?: number;
+  size?: string;
+  color?: string;
+}>();
 // 计算属性：优先使用 props 传入的值，否则继承父级
 const computedSize = computed(() => props.size || "1em");
 const computedColor = computed(() => props.color || "currentColor");
+const svg = ref<SVGSVGElement | null>(null);
+const strokeWidth = ref<number>();
+const refreshStrokeWidth = () => {
+  if (!props.percentage) {
+    strokeWidth.value = undefined;
+    return;
+  }
+  if (!svg.value) return;
+  const symol = document.querySelector("#icon-" + props.name);
+  if (!symol) return;
+  const viewBox = symol.getAttribute("viewBox");
+  if (!viewBox) return;
+  const parts = viewBox.split(" ");
+  if (parts.length === 4) {
+    const size = Math.max(parseFloat(parts[2]), parseFloat(parts[3]));
+    strokeWidth.value = (props.percentage / 100) * size; // 设定为视图高度的 2%
+  }
+};
+watchEffect(refreshStrokeWidth);
+
+watch(props, () => setTimeout(refreshStrokeWidth), { deep: true, flush: "post" });
 </script>

src/components/icon/index.vue

@@ -12,6 +12,7 @@ import { computed } from "vue";
 
 const props = defineProps<{
   name: string;
+  percentage?: number;
   size?: string;
   color?: string;
   tip?: string;

src/example/components/slide/slide-icons.vue

@@ -15,17 +15,16 @@
           <h2>{{ group.name }}</h2>
         </template>
 
-        <div class="type-children" v-for="typeChildren in group.children">
-          <h3 v-if="typeChildren.name">{{ typeChildren.name }}</h3>
-          <div class="icon-items">
-            <div
-              v-for="item in typeChildren.children"
-              @click="drawIcon(item)"
-              :class="{ active: activeName === item.name }"
-            >
-              <Icon :name="item.icon" size="32px" :color="item.color" />
-              <span>{{ item.name }}</span>
-            </div>
+      <div class="type-children" v-for="typeChildren in group.children">
+        <h3 v-if="typeChildren.name">{{ typeChildren.name }}</h3>
+        <div class="icon-items">
+          <div
+            v-for="item in typeChildren.children"
+            @click="drawIcon(item)"
+            :class="{ active: activeName === item.name }"
+          >
+            <Icon :name="item.icon" size="32px" :percentage="2.5" :color="item.color" />
+            <span>{{ item.name }}</span>
           </div>
         </div>
       </ElCollapseItem>

src/example/platform/resource-swkk.ts

@@ -56,7 +56,7 @@ const fetchResource = genCache(
       cadInfo,
       cad,
       traces,
-      detects,
+      // detects,
     ] = await Promise.all([
       get("/user/floorplan.json", {}),
       get("/data/floorplan.json", { floors: [] }),
@@ -66,7 +66,7 @@ const fetchResource = genCache(
       get("/data/floorplan/info.json", { floors: [] }),
       get("/data/floorplan_cad.json", { floors: [] }),
       get("/user/evidence.json", []),
-      get("/images/ai/detect/detect-ai.json", []),
+      // get("/images/ai/detect/detect-ai.json", []),
     ]);
 
     return {
@@ -79,7 +79,7 @@ const fetchResource = genCache(
       cadInfo,
       config,
       traces,
-      detects,
+      // detects,
     };
   },
   150000
@@ -416,7 +416,8 @@ export const getBillTaggingInfos = async (
 export const getAITaggingInfos = async (
   scene: Scene,
   subgroup: any,
-  bound: Record<string, number>
+  bound: Record<string, number>,
+  getTag = true
 ) => {
   const { ais } = await fetchResource(scene);
   const infos: TaggingInfo[] = [];
@@ -445,6 +446,7 @@ export const getAITaggingInfos = async (
 
       const name = itemIcon?.name || "";
       const isTag = icon === "Tag";
+      if (getTag && !isTag) continue;
       if (!name && !isTag) continue;
 
       const pixelCenter = {
@@ -481,59 +483,74 @@ export const getAIBorderTaggingInfos = async (
   bound: Record<string, number>,
   scale: number
 ) => {
-  const { detects } = await fetchResource(scene);
-  const infos: BorderTaggingInfo[] = [];
-  const drawBound = {
-    x: bound.x_min,
-    y: bound.y_min,
-    w: bound.x_max - bound.x_min,
-    h: bound.y_max - bound.y_min,
-  };
-  // console.log(drawBound);
-  for (const shape of detects) {
-    // if (data.imagePath) {
-    //   const reg = data.imagePath.match(/floor_(\d)\.png/);
-    //   const curSubgroup = reg ? Number(reg[1]) : undefined;
-    //   if (curSubgroup !== subgroup) continue;
-    // }
-    for (const box of shape.bbox) {
-      box[1] *= -1
-      // console.log(box)
-    }
-    const min = { x: shape.bbox[0][0], y: shape.bbox[0][1] };
-    const max = { x: shape.bbox[0][0], y: shape.bbox[0][1] };
-    for (const box of shape.bbox) {
-      min.x = Math.min(box[0], min.x);
-      min.y = Math.min(box[1], min.y);
-      max.x = Math.max(box[0], max.x);
-      max.y = Math.max(box[1], max.y);
-    }
-    min.x *= scale;
-    min.y *= scale;
-    max.x *= scale;
-    max.y *= scale;
-
-    const center = {
-      x: (min.x + max.x) / 2,
-      y: (min.y + max.y) / 2,
-    };
-    const size = {
-      width: max.x - min.x,
-      height: max.y - min.y,
-    };
-
-    infos.push({
-      text: shape.name,
+  const taggingInfos = await getAITaggingInfos(scene, subgroup, bound, false);
+  return taggingInfos.map((item) => {
+    const size = item.size!;
+    const p = item.position!;
+    return {
+      text: item.name || "",
       points: [
-        { x: center.x - size.width / 2, y: center.y - size.height / 2 },
-        { x: center.x + size.width / 2, y: center.y - size.height / 2 },
-        { x: center.x + size.width / 2, y: center.y + size.height / 2 },
-        { x: center.x - size.width / 2, y: center.y + size.height / 2 },
+        {
+          x: p.x - (size?.width || 0) / 2,
+          y: p.y - (size?.height || 0) / 2,
+        },
+        {
+          x: p.x + (size?.width || 0) / 2,
+          y: p.y - (size?.height || 0) / 2,
+        },
+        {
+          x: p.x + (size?.width || 0) / 2,
+          y: p.y + (size?.height || 0) / 2,
+        },
+        {
+          x: p.x - (size?.width || 0) / 2,
+          y: p.y + (size?.height || 0) / 2,
+        },
       ],
-      center,
-    });
-  }
-  return infos;
+      center: item.position!,
+    };
+  });
+
+  // const infos: BorderTaggingInfo[] = [];
+  // const { detects } = await fetchResource(scene);
+  // for (const shape of detects) {
+  //   for (const box of shape.bbox) {
+  //     box[1] *= -1
+  //   }
+  //   const min = { x: shape.bbox[0][0], y: shape.bbox[0][1] };
+  //   const max = { x: shape.bbox[0][0], y: shape.bbox[0][1] };
+  //   for (const box of shape.bbox) {
+  //     min.x = Math.min(box[0], min.x);
+  //     min.y = Math.min(box[1], min.y);
+  //     max.x = Math.max(box[0], max.x);
+  //     max.y = Math.max(box[1], max.y);
+  //   }
+  //   min.x *= scale;
+  //   min.y *= scale;
+  //   max.x *= scale;
+  //   max.y *= scale;
+
+  //   const center = {
+  //     x: (min.x + max.x) / 2,
+  //     y: (min.y + max.y) / 2,
+  //   };
+  //   const size = {
+  //     width: max.x - min.x,
+  //     height: max.y - min.y,
+  //   };
+
+  //   infos.push({
+  //     text: shape.name,
+  //     points: [
+  //       { x: center.x - size.width / 2, y: center.y - size.height / 2 },
+  //       { x: center.x + size.width / 2, y: center.y - size.height / 2 },
+  //       { x: center.x + size.width / 2, y: center.y + size.height / 2 },
+  //       { x: center.x - size.width / 2, y: center.y + size.height / 2 },
+  //     ],
+  //     center,
+  //   });
+  // }
+  // return infos;
 };
 
 export const getWallAITaggingInfos = async (
@@ -647,7 +664,6 @@ export const getResource = async ({
   let coverLine: CoverLine;
 
   const compass = await getCompass(scene);
-  console.log(compass);
   const reqs: Promise<any>[] = [
     getCompass(scene),
     getCoverLine(scene, key, scale)
@@ -657,9 +673,9 @@ export const getResource = async ({
           getWallAITaggingInfos(scene, key, scale, cover).then((ts) =>
             wallTaggings.push(...ts)
           ),
-          getAITaggingInfos(scene, key, cover.bound).then((ts) =>
+          getAITaggingInfos(scene, key, cover.bound).then((ts) => {
             taggings.push(...ts)
-          ),
+          }),
           getAIBorderTaggingInfos(scene, key, cover.bound, scale).then((ts) =>
             borderTaggings.push(...ts)
           ),