使用Echarts-gl构建3D中国地图

• 背景

在可视化大屏项目中，需要在中国地图上绘制3D柱状图

• 问题引入

考虑使用echarts-gl 构建3D中国地图，在3D中国地图上增加3D柱状图图层，发现引入echarts-gl后，地图渲染失败，控制台一直报错

• 解决过程

1. npm 安装echarts-gl依赖包

1. 安装成功

1. main.js入口文件中引入模块

1. 根据echarts官网的 GL配置项，开始配置绘制地图，主要配置过程：

1. npm run serve 启动项目，发现地图无法显示，控制台一直有一个报错信息

1. 查看报错位置和代码，发现是echarts-gl 官方代码出现 bug所导致报错“Uncaught ReferenceError__DEV__ is not defined”，需要我们到webpack配置文件中修改对DEV的声明。
2. Vue-cli 2.0脚手架和3.0脚手架生成项目的结构有所不同，修改方式也不一样

Vue-cli 2.0中的修改方法：

修改webpack.dev.conf.js

Vue-cli 3.0中的修改方法：

修改vue.config.js

8,  重启项目，地图渲染成功