制作需求

package.json

@@ -38,6 +38,7 @@
     "pinia": "^2.2.4",
     "sass": "^1.80.4",
     "stateshot": "^1.3.5",
+    "svg-path-commander": "^2.1.11",
     "three": "^0.169.0",
     "uuid": "^11.0.2",
     "vite-plugin-html": "^3.2.2",

pnpm-lock.yaml

@@ -12,6 +12,7 @@ specifiers:
   clipper-lib: ^6.4.2
   dxf-writer: ^1.18.4
   element-plus: ^2.8.6
+  flatten-svg: ^0.3.0
   html2canvas: ^1.4.1
   jspdf: ^3.0.1
   jszip: ^3.10.1
@@ -48,6 +49,7 @@ dependencies:
   clipper-lib: 6.4.2
   dxf-writer: 1.18.4
   element-plus: 2.13.0_vue@3.5.26
+  flatten-svg: 0.3.0
   html2canvas: 1.4.1
   jspdf: 3.0.4
   jszip: 3.10.1
@@ -1816,6 +1818,10 @@ packages:
     dependencies:
       to-regex-range: 5.0.1
 
+  /flatten-svg/0.3.0:
+    resolution: {integrity: sha512-8CwSAVxqDglcgOBCjdL9hiyGXd3CmuEL9zQwiE6oinsjTnM7RZnk/t/2K8URYV9W1adUu1CXlQwW3QdzB5q9Sg==}
+    dev: false
+
   /for-each/0.3.5:
     resolution: {integrity: sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==}
     engines: {node: '>= 0.4'}

src/core/components/line/attach-server.ts

@@ -613,7 +613,7 @@ export const useLineDescribes = (
       { immediate: true }
     );
   } else {
-    useInstallStrokeWidthDescribe(d, line, fixedStrokeOptions);
+    useInstallStrokeWidthDescribe(d, line, fixedStrokeOptions, undefined, undefined, '线宽');
   }
   
   watch(

src/core/components/serial/index.ts

@@ -6,6 +6,7 @@ import { DrawStore } from "@/core/store/index.ts";
 import { Pos } from "@/utils/math.ts";
 import { TableData } from "../table/index.ts";
 import { copy } from "@/utils/shared.ts";
+import { ref } from "vue";
 
 export {
   getMouseStyle,
@@ -37,7 +38,7 @@ export const defaultStyle = {
 };
 
 export const fixedStrokeOptions:number[] = [];
-
+export const autoGenTable = ref(true)
 export type SerialData = CircleData;
 
 export const getSerialFontW = (data: SerialData) => {

src/core/components/serial/serial-group.vue

@@ -24,7 +24,15 @@ import {
   TableData,
   interactiveToData as tableInteractiveToData,
 } from "../table";
-import { defaultTableStyle, delItem, getCurrentNdx, joinKey, SerialData, tableTitle } from ".";
+import {
+  autoGenTable,
+  defaultTableStyle,
+  delItem,
+  getCurrentNdx,
+  joinKey,
+  SerialData,
+  tableTitle,
+} from ".";
 import {
   useGetViewBoxPositionPixel,
   useViewerInvertTransform,
@@ -188,10 +196,11 @@ const updateJoinTable = () => {
   const items = data.value;
 
   let table = jTable.value;
-  if (items.length === 0) {
+  if (!autoGenTable.value || items.length === 0) {
     table && history.preventTrack(() => store.delItem("table", table!.id));
     return;
   }
+
   if (!table) {
     history.preventTrack(() => {
       store.addItem("table", (table = addTable()));

src/core/hook/use-describe.ts

@@ -12,7 +12,8 @@ export const useInstallStrokeWidthDescribe = (
   shape: Ref<{ strokeWidth?: number; fixed?: boolean }>,
   options: number[] = [],
   defProportion?: Proportion,
-  fixed = false
+  fixed = false,
+  label?: string
 ) => {
   const store = useStore();
   const proportion = computed(() => {
@@ -29,6 +30,9 @@ export const useInstallStrokeWidthDescribe = (
           label: `${size} ${proportion.unit}`,
           value: size / proportion.scale,
         }));
+        if (label) {
+          property.label = label
+        }
         describes.value.strokeWidth = property as PropertyDescribes[string];
       } else {
         describes.value.strokeWidth = sysDescribes.strokeWidth as any;

src/core/html-mount/propertys/describes.ts

@@ -4,7 +4,7 @@ import sysDescribes from "./sys-describes.json";
 export const getFixedStrokeWidthProperty = (self: Ref<{ strokeWidth?: number }>) => {
   const property = {
     type: "select",
-    label: "边框粗细",
+    label: "边框线宽",
     props: {
       options: [
         {

src/example/fuse/views/defStyle.ts

@@ -19,6 +19,7 @@ import {
   defaultStyle as serialDefStyle,
   defaultTableStyle as serialTableDefStyle,
   joinKey,
+  autoGenTable,
 } from "@/core/components/serial";
 import { fixedStrokeOptions as serialFixedStrokeOptions } from "@/core/components/serial";
 import { defaultStyle as tableDefStyle } from "@/core/components/table";
@@ -133,7 +134,9 @@ const getOverviewRealPixel = (real: number, border = false) =>
 export const overviewCustomStyle = (_draw: Draw) => {
   const realFixedStrokeOptions = [0.13, 0.18, 0.25, 0.35, 0.5, 0.7];
   const defFixelStroke = getOverviewRealPixel(realFixedStrokeOptions[0], true);
+  autoGenTable.value = false
   const backs = [
+    () => autoGenTable.value = true,
     setDefStyle(lineDefStyle, { strokeWidth: getOverviewRealPixel(120) }),
     setDefStyle(triangleFixedStrokeOptions, realFixedStrokeOptions),
     setDefStyle(circleFixedStrokeOptions, realFixedStrokeOptions),

src/example/fuse/views/overview/slide.vue

@@ -10,6 +10,7 @@ import {
   text,
   test,
   imp,
+  serial,
 } from "../../../components/slide/actions.ts";
 import { useDraw } from "../../../components/container/use-draw.ts";
 import { h, reactive } from "vue";
@@ -22,9 +23,16 @@ const legend = {
   value: uuid(),
   mount: (props: any) => h(SlideIcons, { ...props, groups: iconGroups }),
 };
+const mark = {
+  icon: "line_d",
+  name: "注释",
+  value: uuid(),
+  defSelect: true,
+  children: [text, serial],
+};
 
 const draw = useDraw();
-const menus = reactive([imp, drawAction, legend, text]);
+const menus = reactive([imp, drawAction, legend, mark]);
 
 if (import.meta.env.DEV) {
   menus.push(test);

src/example/fuse/views/tabulation/header.vue

@@ -78,11 +78,7 @@ const actions = [
     {
       ...baseActions.initViewport,
       handler: () => {
-        if (import.meta.env.DEV) {
-          draw.viewer.setViewMat(new Transform());
-        } else {
-          initViewport(draw, 0.05);
-        }
+        initViewport(draw, 0.05);
       },
     },
   ],

src/example/fuse/views/tabulation/index.vue

@@ -17,7 +17,7 @@
     @change-origin="(origin) => setOrigin && setOrigin(origin)"
     :cover-scale="coverSetting?.scale"
     :paperKey="tabulationData?.paperKey"
-    :pixelRatio="needScreenshot ? 2 : pixelRatio"
+    :pixelRatio="needScreenshot ? 6 : pixelRatio"
     :not-debounce="needScreenshot"
     :data="overviewData?.store"
     :scale="draw?.viewerConfig.scaleX"

src/example/fuse/views/tabulation/overview-viewport.vue

@@ -32,6 +32,7 @@ const props = defineProps<{
   pixelRatio?: number;
   notDebounce?: boolean;
 }>();
+
 const emit = defineEmits<{
   (e: "changeConfig", config: { size: Size; scale: number }): void;
   (e: "changeOrigin", origin: HTMLCanvasElement): void;
@@ -192,10 +193,7 @@ const updateOrigin = async () => {
         item.__strokeWidth = item.strokeWidth;
       }
       if ("__strokeWidth" in item) {
-        item.strokeWidth =
-          ((props.pixelRatio || 1) *
-            (item.__strokeWidth * pixelPaperToDrawPixel.value!)) /
-          2;
+        item.strokeWidth = (item.__strokeWidth * pixelPaperToDrawPixel.value!) / 2;
       }
     };
     d.store.items.forEach(setStyle);