Browse Source

对象实例打开时,canvas填满剩余宽度

LXXXY 5 years ago
parent
commit
0e22878b6a
1 changed files with 4 additions and 3 deletions
  1. 4 3
      src/components/point/report/objectInstance.vue

+ 4 - 3
src/components/point/report/objectInstance.vue

@@ -1,7 +1,6 @@
 <template>
   <!-- 对象实例 -->
   <div id="objectInstance" v-loading="loading">
-    <div ref="test1"></div>
     <div class="obj-item" v-for="form in forms" :key="form.id" :style="{height:drawCanvas? '600px' : '350px'}">
       <el-form :model="form" label-width="150px">
         <el-form-item label="对象类型:">
@@ -25,7 +24,7 @@
         <el-form-item label="对象实例位置图:">
           <span v-show="!drawCanvas">--</span>
           <div v-show="drawCanvas" style="border:1px solid rgba(0, 0, 0, 0.2);height:300px;">
-            <canvas v-show="drawCanvas" height="300" width="450" class="instanceMap" :id="form.instanceId" :k="refreshCanvas"></canvas>
+            <canvas v-show="drawCanvas" height="300" :width="canvasWidth" class="instanceMap" :id="form.instanceId" :k="refreshCanvas"></canvas>
           </div>
         </el-form-item>
       </el-form>
@@ -51,7 +50,8 @@ export default {
       scenes: [],//canvas scene
       loading: true,
       refreshCanvas: '',//重载canvas组件
-      drawCanvas: false//是否画canvas
+      drawCanvas: false,//是否画canvas,
+      canvasWidth:450
     }
   },
   methods: {
@@ -161,6 +161,7 @@ export default {
     }
   },
   mounted() {
+    this.canvasWidth = document.getElementById("objectInstance").offsetWidth - 200
     this.loadObjectInstance();
   },
   props: {