vue引入echarts地图的三种方式

一、vue中引入echart

1、安装echarts: npm install echarts --save

2、在main.js文件中引入echarts实例:   Vue.prototype.$echarts = echarts

3、在需要用到echart图形的vue文件中引入:   import echarts from "echarts";

4、如果用到map（地图），还需要导入地图对应的的JS文件：

　　import '../../../node_modules/echarts/map/js/province/yunnan.js'
　　import '../../../node_modules/echarts/map/js/province/fujian.js'

5、map（地图）对应的资源文件有两种，一种是导入JS文件，一种是读取JSON文件，在vue项目中，map对应的资源文件存在于node_moudles中的echarts文件夹，当然在vue中可以通过http请求去读取地图对应的JSON文件，但是要求JSON文件必须在static文件中，不然http请求失败。

二、项目的目录结构：

三、引入echarts的四种方式：

四、界面渲染效果：