画布自适应方法 ResizeObserver

画布自适应方法

画布设置百分比不会生效，需要设置固定值

使用ResizeObserver 监听盒子的尺寸变化 方式改变canvas大小，首先需要给canvas套一个div。在初始化时监听div尺寸变化

<template>
  <div id="box" class="map-list">
     <canvas  :height="canvasHeight+'px'" :width="canvasWidth+'px'"/> 
    <div/>  
 </template> 
<script>
import $$ from 'jquery'
export default {
   
    data() {
   
    return {
   
      ResizeObserver: '',
      showPannel: false,
      canvasHeight
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15