Parcourir la source

[Feat 0000] 风窗svg动画开发

houzekong il y a 2 semaines
Parent
commit
71900896fd

+ 114 - 146
src/views/vent/monitorManager/windowMonitor/components/windowSVG.vue

@@ -6,8 +6,9 @@
     preserveAspectRatio="none"
     x="0px"
     y="0px"
-    width="1920px"
-    height="1080px"
+    width="1536px"
+    height="100%"
+    style="margin-left: calc(50% - 768px)"
     viewBox="0 0 1920 1080"
   >
     <defs>
@@ -1115,14 +1116,8 @@
 </template>
 
 <script setup lang="ts">
-  import { watch, onMounted, defineExpose, defineProps } from 'vue';
-
-  const props = defineProps<{
-    manager: Record<string, boolean>;
-  }>();
-
-  // 存储所有动画元素(不在模板中使用,不需要ref)
-  const animElements = new Map<string, HTMLElement>();
+  import { onMounted, defineExpose } from 'vue';
+  import { useSvgAnimation } from '/@/hooks/vent/useSvgAnimation';
 
   // 元素信息(常量数据,使用Map)
   const elementInfo = new Map([
@@ -1133,6 +1128,14 @@
         initialTransform: 'matrix( 1.10784912109375, -0.261474609375, 0, 1.047607421875, 887.35,495.2) ',
         transforms: [
           'matrix( 1.10784912109375, -0.261474609375, 0, 1.047607421875, 887.35,495.2) ',
+          'matrix( 1.1078033447265625, -0.261474609375, 0.0466461181640625, 1.0326690673828125, 887.35,495.2) ',
+          'matrix( 1.107818603515625, -0.261474609375, 0.092010498046875, 1.0157318115234375, 887.35,495.2) ',
+          'matrix( 1.107818603515625, -0.261474609375, 0.135894775390625, 0.9968109130859375, 887.3,495.2) ',
+          'matrix( 1.107818603515625, -0.261474609375, 0.1782989501953125, 0.9760894775390625, 887.35,495.2) ',
+          'matrix( 1.1078033447265625, -0.261474609375, 0.219085693359375, 0.953521728515625, 887.3,495.2) ',
+          'matrix( 1.1078033447265625, -0.2614593505859375, 0.25823974609375, 0.9293212890625, 887.35,495.2) ',
+          'matrix( 1.1078033447265625, -0.261474609375, 0.295623779296875, 0.903564453125, 887.35,495.2) ',
+          'matrix( 1.107818603515625, -0.261474609375, 0.33123779296875, 0.8763275146484375, 887.35,495.2) ',
           'matrix( 1.107818603515625, -0.2614593505859375, 0.3650054931640625, 0.8477783203125, 887.25,495.2) ',
           'matrix( 1.1078033447265625, -0.2614593505859375, 0.3968963623046875, 0.8179931640625, 887.3,495.15) ',
           'matrix( 1.1078033447265625, -0.261474609375, 0.42681884765625, 0.787078857421875, 887.3,495.15) ',
@@ -1143,7 +1146,6 @@
           'matrix( 1.1078033447265625, -0.2614593505859375, 0.5464935302734375, 0.619598388671875, 887.25,495.15) ',
           'matrix( 1.1077880859375, -0.2614593505859375, 0.5642852783203125, 0.584320068359375, 887.25,495.1) ',
           'matrix( 1.1078033447265625, -0.2614593505859375, 0.5800628662109375, 0.548736572265625, 887.25,495.15) ',
-          'matrix( 1.1078033447265625, -0.261474609375, 0.0466461181640625, 1.0326690673828125, 887.35,495.2) ',
           'matrix( 1.1078033447265625, -0.2614593505859375, 0.5937652587890625, 0.512939453125, 887.3,495.15) ',
           'matrix( 1.1078033447265625, -0.261444091796875, 0.6054840087890625, 0.47705078125, 887.25,495.15) ',
           'matrix( 1.1077880859375, -0.2614593505859375, 0.6151580810546875, 0.4411468505859375, 887.2,495.15) ',
@@ -1154,14 +1156,7 @@
           'matrix( 1.1078033447265625, -0.261444091796875, 0.6345062255859375, 0.265472412109375, 887.15,495.05) ',
           'matrix( 1.1078033447265625, -0.261444091796875, 0.6328582763671875, 0.2317962646484375, 887.1,495.05) ',
           'matrix( 1.1078033447265625, -0.2614593505859375, 0.6294708251953125, 0.198822021484375, 887.2,495.1) ',
-          'matrix( 1.107818603515625, -0.261474609375, 0.092010498046875, 1.0157318115234375, 887.35,495.2) ',
           'matrix( 1.10784912109375, -0.261474609375, 0.624481201171875, 0.1666259765625, 887.3,495) ',
-          'matrix( 1.107818603515625, -0.261474609375, 0.135894775390625, 0.9968109130859375, 887.3,495.2) ',
-          'matrix( 1.107818603515625, -0.261474609375, 0.1782989501953125, 0.9760894775390625, 887.35,495.2) ',
-          'matrix( 1.1078033447265625, -0.261474609375, 0.219085693359375, 0.953521728515625, 887.3,495.2) ',
-          'matrix( 1.1078033447265625, -0.2614593505859375, 0.25823974609375, 0.9293212890625, 887.35,495.2) ',
-          'matrix( 1.1078033447265625, -0.261474609375, 0.295623779296875, 0.903564453125, 887.35,495.2) ',
-          'matrix( 1.107818603515625, -0.261474609375, 0.33123779296875, 0.8763275146484375, 887.35,495.2) ',
         ],
       },
     ],
@@ -1172,6 +1167,14 @@
         initialTransform: 'matrix( 1.10784912109375, -0.261688232421875, 0, 1.0478515625, 887.35,517.25) ',
         transforms: [
           'matrix( 1.10784912109375, -0.261688232421875, 0, 1.0478515625, 887.35,517.25) ',
+          'matrix( 1.107818603515625, -0.2616729736328125, 0.049407958984375, 1.0322113037109375, 887.35,517.25) ',
+          'matrix( 1.1078338623046875, -0.2616729736328125, 0.0973663330078125, 1.0142974853515625, 887.35,517.25) ',
+          'matrix( 1.1078338623046875, -0.2616729736328125, 0.1437225341796875, 0.99420166015625, 887.3,517.2) ',
+          'matrix( 1.1078338623046875, -0.2616729736328125, 0.1883544921875, 0.9720306396484375, 887.35,517.25) ',
+          'matrix( 1.107818603515625, -0.2616729736328125, 0.231231689453125, 0.9478912353515625, 887.35,517.2) ',
+          'matrix( 1.107818603515625, -0.2616729736328125, 0.2722320556640625, 0.9219207763671875, 887.35,517.25) ',
+          'matrix( 1.1078338623046875, -0.2616729736328125, 0.311279296875, 0.8942108154296875, 887.35,517.2) ',
+          'matrix( 1.107818603515625, -0.2616729736328125, 0.34832763671875, 0.8649139404296875, 887.35,517.2) ',
           'matrix( 1.1078338623046875, -0.26165771484375, 0.38330078125, 0.8341522216796875, 887.3,517.2) ',
           'matrix( 1.1078338623046875, -0.26165771484375, 0.4161224365234375, 0.8020477294921875, 887.3,517.25) ',
           'matrix( 1.107818603515625, -0.2616729736328125, 0.44677734375, 0.768768310546875, 887.3,517.2) ',
@@ -1182,7 +1185,6 @@
           'matrix( 1.107818603515625, -0.26165771484375, 0.5662689208984375, 0.5889739990234375, 887.3,517.2) ',
           'matrix( 1.107818603515625, -0.2616729736328125, 0.58331298828125, 0.551300048828125, 887.3,517.2) ',
           'matrix( 1.1078338623046875, -0.26165771484375, 0.5980682373046875, 0.5133514404296875, 887.3,517.2) ',
-          'matrix( 1.107818603515625, -0.2616729736328125, 0.049407958984375, 1.0322113037109375, 887.35,517.25) ',
           'matrix( 1.107818603515625, -0.26165771484375, 0.6105804443359375, 0.475311279296875, 887.3,517.2) ',
           'matrix( 1.107818603515625, -0.2616729736328125, 0.6208343505859375, 0.437255859375, 887.3,517.2) ',
           'matrix( 1.107818603515625, -0.26165771484375, 0.6288604736328125, 0.399322509765625, 887.2,517.2) ',
@@ -1193,14 +1195,7 @@
           'matrix( 1.107818603515625, -0.26165771484375, 0.6372833251953125, 0.21575927734375, 887.2,517.1) ',
           'matrix( 1.1078338623046875, -0.26165771484375, 0.6330108642578125, 0.1810455322265625, 887.15,517.1) ',
           'matrix( 1.107818603515625, -0.2616729736328125, 0.6269073486328125, 0.1472625732421875, 887.2,517.1) ',
-          'matrix( 1.1078338623046875, -0.2616729736328125, 0.0973663330078125, 1.0142974853515625, 887.35,517.25) ',
           'matrix( 1.10784912109375, -0.261688232421875, 0.61907958984375, 0.114501953125, 887.25,517.05) ',
-          'matrix( 1.1078338623046875, -0.2616729736328125, 0.1437225341796875, 0.99420166015625, 887.3,517.2) ',
-          'matrix( 1.1078338623046875, -0.2616729736328125, 0.1883544921875, 0.9720306396484375, 887.35,517.25) ',
-          'matrix( 1.107818603515625, -0.2616729736328125, 0.231231689453125, 0.9478912353515625, 887.35,517.2) ',
-          'matrix( 1.107818603515625, -0.2616729736328125, 0.2722320556640625, 0.9219207763671875, 887.35,517.25) ',
-          'matrix( 1.1078338623046875, -0.2616729736328125, 0.311279296875, 0.8942108154296875, 887.35,517.2) ',
-          'matrix( 1.107818603515625, -0.2616729736328125, 0.34832763671875, 0.8649139404296875, 887.35,517.2) ',
         ],
       },
     ],
@@ -1211,6 +1206,14 @@
         initialTransform: 'matrix( 1.10784912109375, -0.2705078125, 0, 1.05767822265625, 887.35,539.45) ',
         transforms: [
           'matrix( 1.10784912109375, -0.2705078125, 0, 1.05767822265625, 887.35,539.45) ',
+          'matrix( 1.10784912109375, -0.2704925537109375, 0.0465087890625, 1.0418701171875, 887.4,539.5) ',
+          'matrix( 1.10784912109375, -0.2705078125, 0.09161376953125, 1.0241241455078125, 887.45,539.5) ',
+          'matrix( 1.10784912109375, -0.2704925537109375, 0.1352386474609375, 1.0043792724609375, 887.4,539.5) ',
+          'matrix( 1.10784912109375, -0.2705078125, 0.177276611328125, 0.982879638671875, 887.4,539.45) ',
+          'matrix( 1.10784912109375, -0.2705078125, 0.2176971435546875, 0.959625244140625, 887.45,539.5) ',
+          'matrix( 1.10784912109375, -0.2705078125, 0.256378173828125, 0.93475341796875, 887.45,539.45) ',
+          'matrix( 1.10784912109375, -0.2705078125, 0.293304443359375, 0.90838623046875, 887.45,539.45) ',
+          'matrix( 1.10784912109375, -0.2704925537109375, 0.328369140625, 0.8805999755859375, 887.45,539.5) ',
           'matrix( 1.10784912109375, -0.2704925537109375, 0.361572265625, 0.85150146484375, 887.45,539.5) ',
           'matrix( 1.10784912109375, -0.2704925537109375, 0.392822265625, 0.8212432861328125, 887.45,539.45) ',
           'matrix( 1.10784912109375, -0.2705078125, 0.422119140625, 0.7899322509765625, 887.5,539.45) ',
@@ -1221,7 +1224,6 @@
           'matrix( 1.1078338623046875, -0.2704925537109375, 0.5382232666015625, 0.6212921142578125, 887.55,539.4) ',
           'matrix( 1.1078338623046875, -0.2705078125, 0.555267333984375, 0.585968017578125, 887.6,539.4) ',
           'matrix( 1.1078338623046875, -0.2705078125, 0.570281982421875, 0.5503997802734375, 887.55,539.4) ',
-          'matrix( 1.10784912109375, -0.2704925537109375, 0.0465087890625, 1.0418701171875, 887.4,539.5) ',
           'matrix( 1.10784912109375, -0.2704925537109375, 0.5832061767578125, 0.5146636962890625, 887.6,539.4) ',
           'matrix( 1.10784912109375, -0.2704925537109375, 0.5941162109375, 0.4788970947265625, 887.55,539.4) ',
           'matrix( 1.1078338623046875, -0.2705078125, 0.60302734375, 0.44317626953125, 887.6,539.4) ',
@@ -1232,14 +1234,7 @@
           'matrix( 1.1078338623046875, -0.2704925537109375, 0.618621826171875, 0.2693939208984375, 887.55,539.3) ',
           'matrix( 1.1078338623046875, -0.2704925537109375, 0.61627197265625, 0.2362518310546875, 887.6,539.3) ',
           'matrix( 1.1078338623046875, -0.2704925537109375, 0.6122283935546875, 0.2038726806640625, 887.6,539.3) ',
-          'matrix( 1.10784912109375, -0.2705078125, 0.09161376953125, 1.0241241455078125, 887.45,539.5) ',
           'matrix( 1.10784912109375, -0.2705078125, 0.6065673828125, 0.17236328125, 887.35,538.4) ',
-          'matrix( 1.10784912109375, -0.2704925537109375, 0.1352386474609375, 1.0043792724609375, 887.4,539.5) ',
-          'matrix( 1.10784912109375, -0.2705078125, 0.177276611328125, 0.982879638671875, 887.4,539.45) ',
-          'matrix( 1.10784912109375, -0.2705078125, 0.2176971435546875, 0.959625244140625, 887.45,539.5) ',
-          'matrix( 1.10784912109375, -0.2705078125, 0.256378173828125, 0.93475341796875, 887.45,539.45) ',
-          'matrix( 1.10784912109375, -0.2705078125, 0.293304443359375, 0.90838623046875, 887.45,539.45) ',
-          'matrix( 1.10784912109375, -0.2704925537109375, 0.328369140625, 0.8805999755859375, 887.45,539.5) ',
         ],
       },
     ],
@@ -1250,6 +1245,14 @@
         initialTransform: 'matrix( 1.10784912109375, -0.2749481201171875, 0, 1.047607421875, 887.4,569.6) ',
         transforms: [
           'matrix( 1.10784912109375, -0.2749481201171875, 0, 1.047607421875, 887.4,569.6) ',
+          'matrix( 1.1078033447265625, -0.274932861328125, 0.0512847900390625, 1.0341033935546875, 887.4,569.6) ',
+          'matrix( 1.1078033447265625, -0.274932861328125, 0.10125732421875, 1.0182037353515625, 887.4,569.6) ',
+          'matrix( 1.107818603515625, -0.2749481201171875, 0.1497955322265625, 0.9998779296875, 887.4,569.6) ',
+          'matrix( 1.1078033447265625, -0.274932861328125, 0.19671630859375, 0.97930908203125, 887.35,569.65) ',
+          'matrix( 1.107818603515625, -0.274932861328125, 0.2420196533203125, 0.9565582275390625, 887.4,569.6) ',
+          'matrix( 1.107818603515625, -0.2749481201171875, 0.285552978515625, 0.931732177734375, 887.4,569.6) ',
+          'matrix( 1.107818603515625, -0.2749481201171875, 0.327239990234375, 0.9050140380859375, 887.4,569.6) ',
+          'matrix( 1.107818603515625, -0.274932861328125, 0.366973876953125, 0.8764495849609375, 887.45,569.65) ',
           'matrix( 1.1078033447265625, -0.2749481201171875, 0.4047088623046875, 0.8462066650390625, 887.4,569.6) ',
           'matrix( 1.1078033447265625, -0.274932861328125, 0.4403533935546875, 0.8144073486328125, 887.45,569.6) ',
           'matrix( 1.1078033447265625, -0.2749481201171875, 0.4738616943359375, 0.7812042236328125, 887.45,569.6) ',
@@ -1260,7 +1263,6 @@
           'matrix( 1.1078033447265625, -0.2749481201171875, 0.6076507568359375, 0.5983734130859375, 887.45,569.55) ',
           'matrix( 1.1077880859375, -0.274932861328125, 0.6274566650390625, 0.559417724609375, 887.45,569.55) ',
           'matrix( 1.1078033447265625, -0.274932861328125, 0.644927978515625, 0.519989013671875, 887.45,569.55) ',
-          'matrix( 1.1078033447265625, -0.274932861328125, 0.0512847900390625, 1.0341033935546875, 887.4,569.6) ',
           'matrix( 1.1077880859375, -0.274932861328125, 0.6600799560546875, 0.480255126953125, 887.45,569.6) ',
           'matrix( 1.1077880859375, -0.2749481201171875, 0.6728668212890625, 0.4402923583984375, 887.45,569.55) ',
           'matrix( 1.1077880859375, -0.274932861328125, 0.6833648681640625, 0.4002685546875, 887.45,569.55) ',
@@ -1271,14 +1273,7 @@
           'matrix( 1.1077880859375, -0.2749481201171875, 0.70220947265625, 0.2034454345703125, 887.5,569.55) ',
           'matrix( 1.1077880859375, -0.274932861328125, 0.6996002197265625, 0.1656036376953125, 887.5,569.5) ',
           'matrix( 1.1078033447265625, -0.274932861328125, 0.694976806640625, 0.128509521484375, 887.55,569.55) ',
-          'matrix( 1.1078033447265625, -0.274932861328125, 0.10125732421875, 1.0182037353515625, 887.4,569.6) ',
           'matrix( 1.10784912109375, -0.2749481201171875, 0.688446044921875, 0.0923309326171875, 887.5,569.6) ',
-          'matrix( 1.107818603515625, -0.2749481201171875, 0.1497955322265625, 0.9998779296875, 887.4,569.6) ',
-          'matrix( 1.1078033447265625, -0.274932861328125, 0.19671630859375, 0.97930908203125, 887.35,569.65) ',
-          'matrix( 1.107818603515625, -0.274932861328125, 0.2420196533203125, 0.9565582275390625, 887.4,569.6) ',
-          'matrix( 1.107818603515625, -0.2749481201171875, 0.285552978515625, 0.931732177734375, 887.4,569.6) ',
-          'matrix( 1.107818603515625, -0.2749481201171875, 0.327239990234375, 0.9050140380859375, 887.4,569.6) ',
-          'matrix( 1.107818603515625, -0.274932861328125, 0.366973876953125, 0.8764495849609375, 887.45,569.65) ',
         ],
       },
     ],
@@ -1289,6 +1284,14 @@
         initialTransform: 'matrix( 1.10784912109375, -0.2751617431640625, 0, 1.0478515625, 887.4,591.65) ',
         transforms: [
           'matrix( 1.10784912109375, -0.2751617431640625, 0, 1.0478515625, 887.4,591.65) ',
+          'matrix( 1.107818603515625, -0.275146484375, 0.0496978759765625, 1.031646728515625, 887.4,591.7) ',
+          'matrix( 1.1078338623046875, -0.275146484375, 0.0978851318359375, 1.0131683349609375, 887.4,591.65) ',
+          'matrix( 1.107818603515625, -0.275146484375, 0.1444244384765625, 0.992462158203125, 887.4,591.65) ',
+          'matrix( 1.107818603515625, -0.2751312255859375, 0.1891632080078125, 0.96966552734375, 887.4,591.65) ',
+          'matrix( 1.107818603515625, -0.275146484375, 0.2320709228515625, 0.94488525390625, 887.4,591.65) ',
+          'matrix( 1.107818603515625, -0.275146484375, 0.2730255126953125, 0.91827392578125, 887.4,591.65) ',
+          'matrix( 1.107818603515625, -0.2751312255859375, 0.311981201171875, 0.8899383544921875, 887.4,591.65) ',
+          'matrix( 1.107818603515625, -0.275146484375, 0.3488616943359375, 0.8599853515625, 887.4,591.65) ',
           'matrix( 1.107818603515625, -0.275146484375, 0.3835601806640625, 0.8285980224609375, 887.4,591.65) ',
           'matrix( 1.107818603515625, -0.275146484375, 0.4160919189453125, 0.7958831787109375, 887.4,591.65) ',
           'matrix( 1.1078338623046875, -0.275146484375, 0.44635009765625, 0.7620391845703125, 887.45,591.65) ',
@@ -1299,7 +1302,6 @@
           'matrix( 1.107818603515625, -0.2751312255859375, 0.5631256103515625, 0.5798492431640625, 887.4,591.65) ',
           'matrix( 1.107818603515625, -0.2751312255859375, 0.5794677734375, 0.541839599609375, 887.45,591.65) ',
           'matrix( 1.107818603515625, -0.2751312255859375, 0.593475341796875, 0.503631591796875, 887.45,591.65) ',
-          'matrix( 1.107818603515625, -0.275146484375, 0.0496978759765625, 1.031646728515625, 887.4,591.7) ',
           'matrix( 1.1078338623046875, -0.2751312255859375, 0.60516357421875, 0.465362548828125, 887.45,591.65) ',
           'matrix( 1.107818603515625, -0.2751312255859375, 0.61456298828125, 0.4271240234375, 887.4,591.65) ',
           'matrix( 1.107818603515625, -0.2751312255859375, 0.621734619140625, 0.38909912109375, 887.45,591.65) ',
@@ -1310,14 +1312,7 @@
           'matrix( 1.107818603515625, -0.2751312255859375, 0.625518798828125, 0.20611572265625, 887.4,591.6) ',
           'matrix( 1.107818603515625, -0.2751312255859375, 0.6202850341796875, 0.1717681884765625, 887.4,591.55) ',
           'matrix( 1.107818603515625, -0.2751312255859375, 0.6132354736328125, 0.1384124755859375, 887.4,591.6) ',
-          'matrix( 1.1078338623046875, -0.275146484375, 0.0978851318359375, 1.0131683349609375, 887.4,591.65) ',
           'matrix( 1.10784912109375, -0.2751617431640625, 0.604461669921875, 0.10614013671875, 887.5,591.6) ',
-          'matrix( 1.107818603515625, -0.275146484375, 0.1444244384765625, 0.992462158203125, 887.4,591.65) ',
-          'matrix( 1.107818603515625, -0.2751312255859375, 0.1891632080078125, 0.96966552734375, 887.4,591.65) ',
-          'matrix( 1.107818603515625, -0.275146484375, 0.2320709228515625, 0.94488525390625, 887.4,591.65) ',
-          'matrix( 1.107818603515625, -0.275146484375, 0.2730255126953125, 0.91827392578125, 887.4,591.65) ',
-          'matrix( 1.107818603515625, -0.2751312255859375, 0.311981201171875, 0.8899383544921875, 887.4,591.65) ',
-          'matrix( 1.107818603515625, -0.275146484375, 0.3488616943359375, 0.8599853515625, 887.4,591.65) ',
         ],
       },
     ],
@@ -1328,6 +1323,14 @@
         initialTransform: 'matrix( 1.10784912109375, -0.2839813232421875, 0, 1.05767822265625, 887.4,613.85) ',
         transforms: [
           'matrix( 1.10784912109375, -0.2839813232421875, 0, 1.05767822265625, 887.4,613.85) ',
+          'matrix( 1.10784912109375, -0.2839508056640625, 0.0511016845703125, 1.0404815673828125, 887.4,613.8) ',
+          'matrix( 1.1078338623046875, -0.2839508056640625, 0.100555419921875, 1.0208740234375, 887.4,613.8) ',
+          'matrix( 1.10784912109375, -0.2839508056640625, 0.148193359375, 0.998992919921875, 887.4,613.8) ',
+          'matrix( 1.10784912109375, -0.2839508056640625, 0.193939208984375, 0.9748992919921875, 887.35,613.8) ',
+          'matrix( 1.1078338623046875, -0.283966064453125, 0.2376861572265625, 0.9487762451171875, 887.4,613.8) ',
+          'matrix( 1.10784912109375, -0.2839508056640625, 0.2793426513671875, 0.9207305908203125, 887.4,613.8) ',
+          'matrix( 1.1078338623046875, -0.2839508056640625, 0.3188323974609375, 0.89093017578125, 887.4,613.85) ',
+          'matrix( 1.10784912109375, -0.2839508056640625, 0.3560791015625, 0.8594970703125, 887.4,613.8) ',
           'matrix( 1.1078338623046875, -0.2839508056640625, 0.39105224609375, 0.8266143798828125, 887.4,613.8) ',
           'matrix( 1.10784912109375, -0.2839508056640625, 0.42364501953125, 0.792388916015625, 887.4,613.85) ',
           'matrix( 1.10784912109375, -0.2839508056640625, 0.453826904296875, 0.7570037841796875, 887.35,613.85) ',
@@ -1338,7 +1341,6 @@
           'matrix( 1.10784912109375, -0.2839508056640625, 0.56793212890625, 0.5677490234375, 887.4,613.85) ',
           'matrix( 1.10784912109375, -0.2839508056640625, 0.583343505859375, 0.5285186767578125, 887.35,613.85) ',
           'matrix( 1.10784912109375, -0.2839508056640625, 0.596282958984375, 0.4891510009765625, 887.4,613.8) ',
-          'matrix( 1.10784912109375, -0.2839508056640625, 0.0511016845703125, 1.0404815673828125, 887.4,613.8) ',
           'matrix( 1.1078338623046875, -0.2839508056640625, 0.606781005859375, 0.4498291015625, 887.35,613.85) ',
           'matrix( 1.10784912109375, -0.2839508056640625, 0.614898681640625, 0.410675048828125, 887.35,613.85) ',
           'matrix( 1.1078338623046875, -0.2839508056640625, 0.6206817626953125, 0.3718109130859375, 887.35,613.85) ',
@@ -1349,14 +1351,7 @@
           'matrix( 1.1078338623046875, -0.283966064453125, 0.6162872314453125, 0.1867523193359375, 887.25,613.7) ',
           'matrix( 1.10784912109375, -0.2839508056640625, 0.6092987060546875, 0.1524200439453125, 887.25,613.7) ',
           'matrix( 1.10784912109375, -0.2839508056640625, 0.600433349609375, 0.119232177734375, 887.3,613.7) ',
-          'matrix( 1.1078338623046875, -0.2839508056640625, 0.100555419921875, 1.0208740234375, 887.4,613.8) ',
           'matrix( 1.10784912109375, -0.2839813232421875, 0.5898284912109375, 0.087310791015625, 887.45,613.7) ',
-          'matrix( 1.10784912109375, -0.2839508056640625, 0.148193359375, 0.998992919921875, 887.4,613.8) ',
-          'matrix( 1.10784912109375, -0.2839508056640625, 0.193939208984375, 0.9748992919921875, 887.35,613.8) ',
-          'matrix( 1.1078338623046875, -0.283966064453125, 0.2376861572265625, 0.9487762451171875, 887.4,613.8) ',
-          'matrix( 1.10784912109375, -0.2839508056640625, 0.2793426513671875, 0.9207305908203125, 887.4,613.8) ',
-          'matrix( 1.1078338623046875, -0.2839508056640625, 0.3188323974609375, 0.89093017578125, 887.4,613.85) ',
-          'matrix( 1.10784912109375, -0.2839508056640625, 0.3560791015625, 0.8594970703125, 887.4,613.8) ',
         ],
       },
     ],
@@ -1367,6 +1362,14 @@
         initialTransform: 'matrix( 1.10784912109375, -0.261474609375, 0, 1.0476226806640625, 822.15,510.25) ',
         transforms: [
           'matrix( 1.10784912109375, -0.261474609375, 0, 1.0476226806640625, 822.15,510.25) ',
+          'matrix( 1.107818603515625, -0.261474609375, 0.0498046875, 1.0399017333984375, 822.2,510.25) ',
+          'matrix( 1.107818603515625, -0.2614593505859375, 0.0988922119140625, 1.0298614501953125, 822.2,510.25) ',
+          'matrix( 1.107818603515625, -0.261474609375, 0.1471405029296875, 1.017547607421875, 822.2,510.25) ',
+          'matrix( 1.107818603515625, -0.261474609375, 0.1944122314453125, 1.00299072265625, 822.2,510.25) ',
+          'matrix( 1.1078033447265625, -0.2614593505859375, 0.2406463623046875, 0.9862213134765625, 822.2,510.25) ',
+          'matrix( 1.1078033447265625, -0.2614593505859375, 0.285736083984375, 0.96734619140625, 822.2,510.2) ',
+          'matrix( 1.1078033447265625, -0.2614593505859375, 0.3295745849609375, 0.9464569091796875, 822.15,510.25) ',
+          'matrix( 1.107818603515625, -0.2614593505859375, 0.3720703125, 0.923583984375, 822.2,510.2) ',
           'matrix( 1.1078033447265625, -0.261474609375, 0.4131317138671875, 0.8988189697265625, 822.2,510.2) ',
           'matrix( 1.1078033447265625, -0.2614593505859375, 0.4526824951171875, 0.872283935546875, 822.25,510.2) ',
           'matrix( 1.1078033447265625, -0.261474609375, 0.490631103515625, 0.844024658203125, 822.2,510.2) ',
@@ -1377,7 +1380,6 @@
           'matrix( 1.1078033447265625, -0.261474609375, 0.654296875, 0.6802825927734375, 822.2,510.15) ',
           'matrix( 1.107818603515625, -0.2614593505859375, 0.6813812255859375, 0.6437225341796875, 822.25,510.2) ',
           'matrix( 1.1078033447265625, -0.2614593505859375, 0.70648193359375, 0.60614013671875, 822.2,510.15) ',
-          'matrix( 1.107818603515625, -0.261474609375, 0.0498046875, 1.0399017333984375, 822.2,510.25) ',
           'matrix( 1.1078033447265625, -0.2614593505859375, 0.7295684814453125, 0.56768798828125, 822.25,510.2) ',
           'matrix( 1.1078033447265625, -0.2614593505859375, 0.750579833984375, 0.5283966064453125, 822.2,510.15) ',
           'matrix( 1.1078033447265625, -0.2614593505859375, 0.7695465087890625, 0.4884033203125, 822.2,510.15) ',
@@ -1388,14 +1390,7 @@
           'matrix( 1.1077880859375, -0.2614593505859375, 0.83270263671875, 0.281646728515625, 822.25,510.05) ',
           'matrix( 1.107818603515625, -0.261444091796875, 0.8389892578125, 0.23968505859375, 822.25,510.05) ',
           'matrix( 1.1078033447265625, -0.2614593505859375, 0.843170166015625, 0.197784423828125, 822.2,510) ',
-          'matrix( 1.107818603515625, -0.2614593505859375, 0.0988922119140625, 1.0298614501953125, 822.2,510.25) ',
           'matrix( 1.10784912109375, -0.261474609375, 0.8453369140625, 0.1560516357421875, 822.25,510.05) ',
-          'matrix( 1.107818603515625, -0.261474609375, 0.1471405029296875, 1.017547607421875, 822.2,510.25) ',
-          'matrix( 1.107818603515625, -0.261474609375, 0.1944122314453125, 1.00299072265625, 822.2,510.25) ',
-          'matrix( 1.1078033447265625, -0.2614593505859375, 0.2406463623046875, 0.9862213134765625, 822.2,510.25) ',
-          'matrix( 1.1078033447265625, -0.2614593505859375, 0.285736083984375, 0.96734619140625, 822.2,510.2) ',
-          'matrix( 1.1078033447265625, -0.2614593505859375, 0.3295745849609375, 0.9464569091796875, 822.15,510.25) ',
-          'matrix( 1.107818603515625, -0.2614593505859375, 0.3720703125, 0.923583984375, 822.2,510.2) ',
         ],
       },
     ],
@@ -1406,6 +1401,14 @@
         initialTransform: 'matrix( 1.10784912109375, -0.261688232421875, 0, 1.0478515625, 822.15,532.3) ',
         transforms: [
           'matrix( 1.10784912109375, -0.261688232421875, 0, 1.0478515625, 822.15,532.3) ',
+          'matrix( 1.1078338623046875, -0.2616729736328125, 0.050994873046875, 1.0390167236328125, 822.2,532.3) ',
+          'matrix( 1.1078338623046875, -0.2616729736328125, 0.1011505126953125, 1.0277252197265625, 822.2,532.35) ',
+          'matrix( 1.107818603515625, -0.2616729736328125, 0.1503448486328125, 1.0140838623046875, 822.2,532.3) ',
+          'matrix( 1.107818603515625, -0.261688232421875, 0.198394775390625, 0.99810791015625, 822.2,532.3) ',
+          'matrix( 1.107818603515625, -0.26165771484375, 0.24530029296875, 0.9798126220703125, 822.2,532.25) ',
+          'matrix( 1.107818603515625, -0.26165771484375, 0.290863037109375, 0.959381103515625, 822.25,532.3) ',
+          'matrix( 1.1078338623046875, -0.2616729736328125, 0.33502197265625, 0.9368438720703125, 822.2,532.3) ',
+          'matrix( 1.1078338623046875, -0.261688232421875, 0.377685546875, 0.9123382568359375, 822.25,532.25) ',
           'matrix( 1.1078338623046875, -0.2616729736328125, 0.41876220703125, 0.8858795166015625, 822.2,532.3) ',
           'matrix( 1.107818603515625, -0.2616729736328125, 0.4581451416015625, 0.85760498046875, 822.25,532.3) ',
           'matrix( 1.107818603515625, -0.2616729736328125, 0.495758056640625, 0.82763671875, 822.25,532.3) ',
@@ -1416,7 +1419,6 @@
           'matrix( 1.107818603515625, -0.2616729736328125, 0.6552581787109375, 0.6557464599609375, 822.25,532.25) ',
           'matrix( 1.107818603515625, -0.2616729736328125, 0.6810302734375, 0.6177215576171875, 822.3,532.2) ',
           'matrix( 1.107818603515625, -0.26165771484375, 0.7046661376953125, 0.5788116455078125, 822.3,532.2) ',
-          'matrix( 1.1078338623046875, -0.2616729736328125, 0.050994873046875, 1.0390167236328125, 822.2,532.3) ',
           'matrix( 1.1078033447265625, -0.2616729736328125, 0.726165771484375, 0.5390625, 822.25,532.2) ',
           'matrix( 1.1078338623046875, -0.26165771484375, 0.74542236328125, 0.49859619140625, 822.3,532.2) ',
           'matrix( 1.107818603515625, -0.2616729736328125, 0.7625274658203125, 0.457550048828125, 822.3,532.15) ',
@@ -1427,14 +1429,7 @@
           'matrix( 1.1078033447265625, -0.26165771484375, 0.814697265625, 0.2476654052734375, 822.3,532.1) ',
           'matrix( 1.1078033447265625, -0.26165771484375, 0.81854248046875, 0.2055816650390625, 822.3,532.1) ',
           'matrix( 1.1078033447265625, -0.2616729736328125, 0.8202362060546875, 0.1636962890625, 822.3,532.1) ',
-          'matrix( 1.1078338623046875, -0.2616729736328125, 0.1011505126953125, 1.0277252197265625, 822.2,532.35) ',
           'matrix( 1.10784912109375, -0.261688232421875, 0.8198394775390625, 0.1221771240234375, 822.15,532.1) ',
-          'matrix( 1.107818603515625, -0.2616729736328125, 0.1503448486328125, 1.0140838623046875, 822.2,532.3) ',
-          'matrix( 1.107818603515625, -0.261688232421875, 0.198394775390625, 0.99810791015625, 822.2,532.3) ',
-          'matrix( 1.107818603515625, -0.26165771484375, 0.24530029296875, 0.9798126220703125, 822.2,532.25) ',
-          'matrix( 1.107818603515625, -0.26165771484375, 0.290863037109375, 0.959381103515625, 822.25,532.3) ',
-          'matrix( 1.1078338623046875, -0.2616729736328125, 0.33502197265625, 0.9368438720703125, 822.2,532.3) ',
-          'matrix( 1.1078338623046875, -0.261688232421875, 0.377685546875, 0.9123382568359375, 822.25,532.25) ',
         ],
       },
     ],
@@ -1445,6 +1440,14 @@
         initialTransform: 'matrix( 1.10784912109375, -0.2705078125, 0, 1.0576934814453125, 822.15,554.5) ',
         transforms: [
           'matrix( 1.10784912109375, -0.2705078125, 0, 1.0576934814453125, 822.15,554.5) ',
+          'matrix( 1.10784912109375, -0.2704925537109375, 0.053253173828125, 1.04815673828125, 822.15,554.55) ',
+          'matrix( 1.10784912109375, -0.2705078125, 0.1055755615234375, 1.0360107421875, 822.15,554.5) ',
+          'matrix( 1.10784912109375, -0.2705078125, 0.15679931640625, 1.021270751953125, 822.25,554.5) ',
+          'matrix( 1.10784912109375, -0.2705078125, 0.2067718505859375, 1.0040283203125, 822.3,554.5) ',
+          'matrix( 1.10784912109375, -0.2704925537109375, 0.2554473876953125, 0.984344482421875, 822.3,554.45) ',
+          'matrix( 1.10784912109375, -0.2704925537109375, 0.302642822265625, 0.962371826171875, 822.3,554.45) ',
+          'matrix( 1.1078338623046875, -0.2704925537109375, 0.3482818603515625, 0.9381103515625, 822.3,554.45) ',
+          'matrix( 1.10784912109375, -0.2705078125, 0.392242431640625, 0.9117584228515625, 822.35,554.4) ',
           'matrix( 1.10784912109375, -0.2705078125, 0.4344024658203125, 0.8833465576171875, 822.4,554.45) ',
           'matrix( 1.10784912109375, -0.2704925537109375, 0.474761962890625, 0.8530426025390625, 822.4,554.45) ',
           'matrix( 1.1078338623046875, -0.2704925537109375, 0.5131072998046875, 0.820953369140625, 822.4,554.4) ',
@@ -1455,7 +1458,6 @@
           'matrix( 1.1078338623046875, -0.2704925537109375, 0.67333984375, 0.637725830078125, 822.45,554.3) ',
           'matrix( 1.10784912109375, -0.2704925537109375, 0.69866943359375, 0.597442626953125, 822.5,554.3) ',
           'matrix( 1.10784912109375, -0.2704925537109375, 0.721649169921875, 0.5562286376953125, 822.6,554.3) ',
-          'matrix( 1.10784912109375, -0.2704925537109375, 0.053253173828125, 1.04815673828125, 822.15,554.55) ',
           'matrix( 1.1078338623046875, -0.2704925537109375, 0.7422637939453125, 0.5142669677734375, 822.6,554.25) ',
           'matrix( 1.10784912109375, -0.2704925537109375, 0.7604827880859375, 0.47161865234375, 822.55,554.25) ',
           'matrix( 1.1078338623046875, -0.2704925537109375, 0.7763214111328125, 0.428466796875, 822.55,554.25) ',
@@ -1466,14 +1468,7 @@
           'matrix( 1.10784912109375, -0.2704925537109375, 0.8196563720703125, 0.2096405029296875, 822.65,554.1) ',
           'matrix( 1.10784912109375, -0.2704925537109375, 0.821258544921875, 0.1661376953125, 822.65,554.05) ',
           'matrix( 1.1078338623046875, -0.2704925537109375, 0.820587158203125, 0.123016357421875, 822.65,554.05) ',
-          'matrix( 1.10784912109375, -0.2705078125, 0.1055755615234375, 1.0360107421875, 822.15,554.5) ',
           'matrix( 1.10784912109375, -0.2705078125, 0.8177032470703125, 0.0804443359375, 822.5,554.05) ',
-          'matrix( 1.10784912109375, -0.2705078125, 0.15679931640625, 1.021270751953125, 822.25,554.5) ',
-          'matrix( 1.10784912109375, -0.2705078125, 0.2067718505859375, 1.0040283203125, 822.3,554.5) ',
-          'matrix( 1.10784912109375, -0.2704925537109375, 0.2554473876953125, 0.984344482421875, 822.3,554.45) ',
-          'matrix( 1.10784912109375, -0.2704925537109375, 0.302642822265625, 0.962371826171875, 822.3,554.45) ',
-          'matrix( 1.1078338623046875, -0.2704925537109375, 0.3482818603515625, 0.9381103515625, 822.3,554.45) ',
-          'matrix( 1.10784912109375, -0.2705078125, 0.392242431640625, 0.9117584228515625, 822.35,554.4) ',
         ],
       },
     ],
@@ -1484,6 +1479,14 @@
         initialTransform: 'matrix( 1.10784912109375, -0.26531982421875, 0, 1.047607421875, 822.45,587.75) ',
         transforms: [
           'matrix( 1.10784912109375, -0.26531982421875, 0, 1.047607421875, 822.45,587.75) ',
+          'matrix( 1.107818603515625, -0.265289306640625, 0.0520172119140625, 1.0391082763671875, 822.5,587.75) ',
+          'matrix( 1.1078338623046875, -0.265289306640625, 0.103240966796875, 1.0280914306640625, 822.5,587.75) ',
+          'matrix( 1.107818603515625, -0.265289306640625, 0.1534881591796875, 1.01458740234375, 822.5,587.7) ',
+          'matrix( 1.107818603515625, -0.265289306640625, 0.202606201171875, 0.9986572265625, 822.45,587.75) ',
+          'matrix( 1.107818603515625, -0.265289306640625, 0.25054931640625, 0.9803314208984375, 822.5,587.7) ',
+          'matrix( 1.107818603515625, -0.265289306640625, 0.2971649169921875, 0.9597625732421875, 822.5,587.75) ',
+          'matrix( 1.107818603515625, -0.265289306640625, 0.3423614501953125, 0.9369964599609375, 822.5,587.75) ',
+          'matrix( 1.107818603515625, -0.265289306640625, 0.3860321044921875, 0.912109375, 822.55,587.75) ',
           'matrix( 1.107818603515625, -0.2653045654296875, 0.428070068359375, 0.8852386474609375, 822.55,587.7) ',
           'matrix( 1.107818603515625, -0.2653045654296875, 0.468414306640625, 0.8564453125, 822.55,587.75) ',
           'matrix( 1.107818603515625, -0.265289306640625, 0.5069122314453125, 0.82586669921875, 822.55,587.75) ',
@@ -1494,7 +1497,6 @@
           'matrix( 1.107818603515625, -0.265289306640625, 0.670013427734375, 0.6497344970703125, 822.55,587.7) ',
           'matrix( 1.107818603515625, -0.2653045654296875, 0.6963043212890625, 0.610687255859375, 822.55,587.7) ',
           'matrix( 1.1078033447265625, -0.2653045654296875, 0.72039794921875, 0.5706634521484375, 822.55,587.75) ',
-          'matrix( 1.107818603515625, -0.265289306640625, 0.0520172119140625, 1.0391082763671875, 822.5,587.75) ',
           'matrix( 1.1078033447265625, -0.265289306640625, 0.742218017578125, 0.529754638671875, 822.55,587.75) ',
           'matrix( 1.1078033447265625, -0.265289306640625, 0.76177978515625, 0.4881134033203125, 822.55,587.7) ',
           'matrix( 1.1078033447265625, -0.265289306640625, 0.779052734375, 0.445831298828125, 822.55,587.75) ',
@@ -1505,14 +1507,7 @@
           'matrix( 1.107818603515625, -0.265289306640625, 0.830810546875, 0.2295379638671875, 822.6,587.65) ',
           'matrix( 1.107818603515625, -0.265289306640625, 0.8342742919921875, 0.186126708984375, 822.6,587.65) ',
           'matrix( 1.1078338623046875, -0.265289306640625, 0.83551025390625, 0.1429443359375, 822.6,587.65) ',
-          'matrix( 1.1078338623046875, -0.265289306640625, 0.103240966796875, 1.0280914306640625, 822.5,587.75) ',
           'matrix( 1.10784912109375, -0.26531982421875, 0.8345489501953125, 0.1001434326171875, 822.5,587.7) ',
-          'matrix( 1.107818603515625, -0.265289306640625, 0.1534881591796875, 1.01458740234375, 822.5,587.7) ',
-          'matrix( 1.107818603515625, -0.265289306640625, 0.202606201171875, 0.9986572265625, 822.45,587.75) ',
-          'matrix( 1.107818603515625, -0.265289306640625, 0.25054931640625, 0.9803314208984375, 822.5,587.7) ',
-          'matrix( 1.107818603515625, -0.265289306640625, 0.2971649169921875, 0.9597625732421875, 822.5,587.75) ',
-          'matrix( 1.107818603515625, -0.265289306640625, 0.3423614501953125, 0.9369964599609375, 822.5,587.75) ',
-          'matrix( 1.107818603515625, -0.265289306640625, 0.3860321044921875, 0.912109375, 822.55,587.75) ',
         ],
       },
     ],
@@ -1523,6 +1518,14 @@
         initialTransform: 'matrix( 1.10784912109375, -0.272308349609375, 0, 1.0478515625, 822.45,610.2) ',
         transforms: [
           'matrix( 1.10784912109375, -0.272308349609375, 0, 1.0478515625, 822.45,610.2) ',
+          'matrix( 1.10784912109375, -0.2722930908203125, 0.0510406494140625, 1.0365142822265625, 822.5,610.2) ',
+          'matrix( 1.10784912109375, -0.272308349609375, 0.100982666015625, 1.0227508544921875, 822.5,610.15) ',
+          'matrix( 1.10784912109375, -0.272308349609375, 0.1497039794921875, 1.006622314453125, 822.5,610.15) ',
+          'matrix( 1.10784912109375, -0.272308349609375, 0.197052001953125, 0.9882049560546875, 822.5,610.2) ',
+          'matrix( 1.10784912109375, -0.2722930908203125, 0.243011474609375, 0.967559814453125, 822.55,610.2) ',
+          'matrix( 1.10784912109375, -0.272308349609375, 0.287384033203125, 0.944854736328125, 822.5,610.15) ',
+          'matrix( 1.1078338623046875, -0.2722930908203125, 0.3301544189453125, 0.920135498046875, 822.55,610.2) ',
+          'matrix( 1.10784912109375, -0.272308349609375, 0.37115478515625, 0.8935089111328125, 822.55,610.1) ',
           'matrix( 1.1078338623046875, -0.272308349609375, 0.410369873046875, 0.8650970458984375, 822.5,610.15) ',
           'matrix( 1.1078338623046875, -0.2722930908203125, 0.4476776123046875, 0.8350067138671875, 822.5,610.15) ',
           'matrix( 1.10784912109375, -0.2722930908203125, 0.4830322265625, 0.803375244140625, 822.5,610.1) ',
@@ -1533,7 +1536,6 @@
           'matrix( 1.1078338623046875, -0.272308349609375, 0.6286468505859375, 0.626068115234375, 822.6,610.1) ',
           'matrix( 1.1078338623046875, -0.2722930908203125, 0.6512451171875, 0.5876617431640625, 822.6,610.1) ',
           'matrix( 1.10784912109375, -0.2722930908203125, 0.6715850830078125, 0.548553466796875, 822.6,610.1) ',
-          'matrix( 1.10784912109375, -0.2722930908203125, 0.0510406494140625, 1.0365142822265625, 822.5,610.2) ',
           'matrix( 1.10784912109375, -0.272308349609375, 0.689697265625, 0.5089263916015625, 822.55,610.1) ',
           'matrix( 1.1078338623046875, -0.272308349609375, 0.7055206298828125, 0.46881103515625, 822.6,610.1) ',
           'matrix( 1.1078338623046875, -0.272308349609375, 0.7191162109375, 0.42840576171875, 822.6,610.1) ',
@@ -1544,14 +1546,7 @@
           'matrix( 1.1078338623046875, -0.272308349609375, 0.75372314453125, 0.2259063720703125, 822.55,609.95) ',
           'matrix( 1.1078338623046875, -0.2722930908203125, 0.7541961669921875, 0.1861419677734375, 822.55,610) ',
           'matrix( 1.10784912109375, -0.2722930908203125, 0.752593994140625, 0.146881103515625, 822.65,610) ',
-          'matrix( 1.10784912109375, -0.272308349609375, 0.100982666015625, 1.0227508544921875, 822.5,610.15) ',
           'matrix( 1.10784912109375, -0.272308349609375, 0.748992919921875, 0.1082611083984375, 822.55,610) ',
-          'matrix( 1.10784912109375, -0.272308349609375, 0.1497039794921875, 1.006622314453125, 822.5,610.15) ',
-          'matrix( 1.10784912109375, -0.272308349609375, 0.197052001953125, 0.9882049560546875, 822.5,610.2) ',
-          'matrix( 1.10784912109375, -0.2722930908203125, 0.243011474609375, 0.967559814453125, 822.55,610.2) ',
-          'matrix( 1.10784912109375, -0.272308349609375, 0.287384033203125, 0.944854736328125, 822.5,610.15) ',
-          'matrix( 1.1078338623046875, -0.2722930908203125, 0.3301544189453125, 0.920135498046875, 822.55,610.2) ',
-          'matrix( 1.10784912109375, -0.272308349609375, 0.37115478515625, 0.8935089111328125, 822.55,610.1) ',
         ],
       },
     ],
@@ -1562,6 +1557,14 @@
         initialTransform: 'matrix( 1.10784912109375, -0.289154052734375, 0, 1.001739501953125, 822.45,631.9) ',
         transforms: [
           'matrix( 1.10784912109375, -0.289154052734375, 0, 1.001739501953125, 822.45,631.9) ',
+          'matrix( 1.1078338623046875, -0.2891387939453125, 0.05157470703125, 0.9912261962890625, 822.5,631.9) ',
+          'matrix( 1.1078338623046875, -0.2891387939453125, 0.1020965576171875, 0.9781494140625, 822.5,631.9) ',
+          'matrix( 1.1078338623046875, -0.28912353515625, 0.151397705078125, 0.962493896484375, 822.5,631.9) ',
+          'matrix( 1.1078338623046875, -0.28912353515625, 0.1993255615234375, 0.944427490234375, 822.5,631.9) ',
+          'matrix( 1.1078338623046875, -0.2891387939453125, 0.245819091796875, 0.923980712890625, 822.5,631.9) ',
+          'matrix( 1.107818603515625, -0.2891387939453125, 0.2907257080078125, 0.901275634765625, 822.55,631.95) ',
+          'matrix( 1.107818603515625, -0.289154052734375, 0.333953857421875, 0.87640380859375, 822.55,631.9) ',
+          'matrix( 1.1078338623046875, -0.2891387939453125, 0.3753662109375, 0.8495330810546875, 822.55,631.9) ',
           'matrix( 1.107818603515625, -0.2891387939453125, 0.4149169921875, 0.8207244873046875, 822.55,631.9) ',
           'matrix( 1.107818603515625, -0.2891387939453125, 0.452484130859375, 0.790130615234375, 822.55,631.9) ',
           'matrix( 1.107818603515625, -0.2891387939453125, 0.488006591796875, 0.7578887939453125, 822.55,631.85) ',
@@ -1572,7 +1575,6 @@
           'matrix( 1.107818603515625, -0.2891387939453125, 0.632781982421875, 0.57623291015625, 822.5,631.8) ',
           'matrix( 1.1078338623046875, -0.2891387939453125, 0.654815673828125, 0.536773681640625, 822.55,631.85) ',
           'matrix( 1.107818603515625, -0.2891387939453125, 0.67449951171875, 0.4965972900390625, 822.55,631.85) ',
-          'matrix( 1.1078338623046875, -0.2891387939453125, 0.05157470703125, 0.9912261962890625, 822.5,631.9) ',
           'matrix( 1.1078033447265625, -0.28912353515625, 0.6917877197265625, 0.455841064453125, 822.55,631.8) ',
           'matrix( 1.107818603515625, -0.2891387939453125, 0.7066802978515625, 0.4146575927734375, 822.55,631.8) ',
           'matrix( 1.1078338623046875, -0.28912353515625, 0.71917724609375, 0.3731536865234375, 822.55,631.8) ',
@@ -1583,71 +1585,37 @@
           'matrix( 1.107818603515625, -0.28912353515625, 0.7464599609375, 0.1657867431640625, 822.5,631.75) ',
           'matrix( 1.1078338623046875, -0.28912353515625, 0.7450714111328125, 0.1252593994140625, 822.55,631.75) ',
           'matrix( 1.107818603515625, -0.28912353515625, 0.7415313720703125, 0.085296630859375, 822.55,631.7) ',
-          'matrix( 1.1078338623046875, -0.2891387939453125, 0.1020965576171875, 0.9781494140625, 822.5,631.9) ',
           'matrix( 1.10784912109375, -0.289154052734375, 0.73590087890625, 0.0460968017578125, 822.4,631.75) ',
-          'matrix( 1.1078338623046875, -0.28912353515625, 0.151397705078125, 0.962493896484375, 822.5,631.9) ',
-          'matrix( 1.1078338623046875, -0.28912353515625, 0.1993255615234375, 0.944427490234375, 822.5,631.9) ',
-          'matrix( 1.1078338623046875, -0.2891387939453125, 0.245819091796875, 0.923980712890625, 822.5,631.9) ',
-          'matrix( 1.107818603515625, -0.2891387939453125, 0.2907257080078125, 0.901275634765625, 822.55,631.95) ',
-          'matrix( 1.107818603515625, -0.289154052734375, 0.333953857421875, 0.87640380859375, 822.55,631.9) ',
-          'matrix( 1.1078338623046875, -0.2891387939453125, 0.3753662109375, 0.8495330810546875, 822.55,631.9) ',
         ],
       },
     ],
   ]);
 
+  const { animationElements, triggerAnimation } = useSvgAnimation(elementInfo);
+
   // 初始化元素引用
   onMounted(() => {
-    elementInfo.forEach((info, elementId) => {
+    elementInfo.forEach((__, elementId) => {
       const el = document.querySelector(`[data-anim-id="${elementId}"]`);
       if (el) {
-        animElements.set(elementId, el as HTMLElement);
-        // 设置初始transform
-        const initialTransform = info.transforms[0] || '';
-        el.setAttribute('transform', initialTransform);
+        animationElements.set(elementId, el as HTMLElement);
       }
     });
   });
 
-  // 监听manager变化并执行动画
-  watch(
-    () => props.manager,
-    (newManager) => {
-      Object.keys(newManager).forEach((key) => {
-        const isActive = newManager[key];
-
-        // 找到所有属于这个key的元素
-        animateByKey(key, isActive);
-      });
-    },
-    { deep: true }
-  );
-
-  // 直接控制动画的方法
-  const animateElement = (elementId: string, toEnd: boolean, duration: number = 3000) => {
-    const el = animElements.get(elementId);
-    const info = elementInfo.get(elementId);
-
-    if (el && info && info.transforms.length > 1) {
-      el.style.transition = `transform ${duration}ms`;
-      el.setAttribute('transform', toEnd ? info.transforms[info.transforms.length - 1] : info.transforms[0]);
+  /** 根据SVG的使用场景播放动画 */
+  function animate(data: any) {
+    // 在SVG图片中,找到需要动起来的元素(类似<use xlink:href="#RE_L_0_Layer0_0_FILL"></use>),并填入id即可控制该元素的动画(如有)
+    if (data.OpenDegree || data.OpenDegree1 || data.OpenDegree2 || data.OpenDegree3) {
+      triggerAnimation(['shanye_0_Layer0_0_FILL'], !Boolean(data.OpenDegree || data.OpenDegree1 || data.OpenDegree2 || data.OpenDegree3));
+    } else {
+      triggerAnimation(['shanye_0_Layer0_0_FILL'], !Boolean(data.forntArea || data.rearArea));
     }
-  };
-
-  // 批量控制同一key的所有元素
-  const animateByKey = (key: string, toEnd: boolean, duration: number = 3000) => {
-    animElements.forEach((__, elementId) => {
-      const info = elementInfo.get(elementId);
-      if (info && info.key === key) {
-        animateElement(elementId, toEnd, duration);
-      }
-    });
-  };
+  }
 
   // 导出方法以便外部调用
   defineExpose({
-    animateElement,
-    animateByKey,
+    animate,
   });
 </script>
 <style scoped>

+ 4 - 5
src/views/vent/monitorManager/windowMonitor/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <component :loading="loading" :manager="animationManager" :is="modelComponent" />
+  <component ref="modelRef" :loading="loading" :is="modelComponent" />
   <div class="scene-box">
     <div class="top-box">
       <div class="top-center" style="display: flex">
@@ -230,16 +230,15 @@
   import { useMessage } from '/@/hooks/web/useMessage';
   import { useGlobSetting } from '/@/hooks/setting';
   import { getModelComponent } from './window.data';
-  import { useSvgAnimation } from '/@/hooks/vent/useSvgAnimation';
 
   const { hasPermission } = usePermission();
   const { sysOrgCode } = useGlobSetting();
   const globalConfig = inject('globalConfig');
 
+  const modelRef = ref();
   /** 模型对应的组件,根据实际情况分为二维三维 */
-  const modelComponent = getModelComponent(globalConfig.is2DModel, sysOrgCode);
+  const modelComponent = getModelComponent(true, sysOrgCode);
 
-  const { animationManager, triggerAnimation } = useSvgAnimation();
   const { currentRoute } = useRouter();
 
   const MonitorDataTable = ref();
@@ -386,7 +385,7 @@
 
   // 判断前后窗的面积是否发生改变,如果改变则开启动画
   const playAnimation = (data, maxarea = 90, isFirst = false) => {
-    triggerAnimation('shanye_0_Layer0_0_FILL', isFirst);
+    modelRef.value?.animate?.(data);
     computePlay(data, maxarea, isFirst);
   };