Vue大屏实战五：中间地图的实现

1.静态数据效果图

2.中间地图布局

<div class="contetn_center">
        <CenterMap class="contetn_center_top" />
        <div>
          //地图底部布局
        </div>

      </div>

我们对左右两侧的宽度及高度调整后即可实现效果图中左右两行一列echart图效果，在Vue大屏实战二：页面三分实现左中右布局 中默认配置的宽度是270px改为520px即可，高度三行echart的默认高度是300px,改为2行则高度改为450px即可，中间地图保持或者调整下高度适配地图底部模块的展示。

3.地图引入

主页面

import CenterMap from './center-map.vue'
components: {
    CenterMap,
  },

地图center-map.vue页面