如何在vue脚手架里面使用echarts 组件显示中国地图---亲测

网上查阅好多资料 在 vue里面 有推荐引用

1，引入 China.js文件

  import echarts from 'echarts';  import  'echarts/lib/chart/map';  import 'echarts/map/js/china.js';

推荐这样使用 但是做出来的效果是缩成一团的 （我已经使用百分比适应屏幕了，所以不存在没有设置宽高的问题）

2，网络请求引入 china.json  效果是出来了 但是一刷新就会报错找不到registerMap方法

3，最终实现方式

按需引入js  

// 按需引入基本模板
  let echarts = require('echarts/lib/echarts');
  require('echarts/lib/chart/bar');  // 引入柱状图组件
  require('echarts/lib/chart/pie');  // 引入饼状图组件
  require('echarts/map/js/china.js');  // 引入中国地图组件
  // 引入提示框和title组件
  require('echarts/lib/component/tooltip');
  require('echarts/lib/component/title');

之后网络请求china.json

request
          .get('../../static/js/china.json')
          .end((err,res)=>{
              if(!err){
                echarts.registerMap('china', res.body);
               var option = {}

....................

就可以啦

最终效果图