perfect_preview&view_saveAS

src/views/Preview.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="preview">
+  <div class="preview" :style="{ background: bgColor }">
     <div class="meta2d-canvas" ref="meta2dDom"></div>
   </div>
 </template>
@@ -27,6 +27,8 @@ const meta2dOptions: Options = {
   defaultFormat: { ...defaultFormat },
 };
 
+const bgColor = ref('#1e2430');
+
 onMounted(() => {
   meta2d = new Meta2d(meta2dDom.value, meta2dOptions);
   registerBasicDiagram();
@@ -50,7 +52,9 @@ const open = async () => {
     if (data) {
       data = JSON.parse(data);
       data.locked = 1;
+      data.rule = false;
       meta2d.open(data);
+      bgColor.value = data.background;
     }
   }
 };
@@ -72,7 +76,7 @@ onUnmounted(() => {
 .preview {
   width: 100vw;
   height: 100vh;
-  background-color: var(--color-background-editor);
+  /* background-color: var(--color-background-editor); */
   .meta2d-canvas {
     width: 100%;
     height: 100%;

src/views/components/View.vue

@@ -758,8 +758,8 @@ const open = async (flag: boolean = false) => {
       meta2d.open({ pens: [] } as any);
     }
   }
-  meta2d.store.data.x = meta2d.store.options.x || 0;
-  meta2d.store.data.y = meta2d.store.options.y || 0;
+  !meta2d.store.data.x && (meta2d.store.data.x = meta2d.store.options.x || 0);
+  !meta2d.store.data.y && (meta2d.store.data.y = meta2d.store.options.y || 0);
 };
 
 const openedListener = () => {