地图echart报错“BMap.Overlay is not a constructor”

这两天首页做个地图echart,调用了百度地图api。按照流程写完之后echats的地图出不来报错“BMap.Overlay is not a constructor”,耽误了好久终于解决

本地引用如下

 			

排查

1,检查地图及echart需要引用的js是否都引入进来
2,检查初始化方法及是否调用成功
3,检查地图初始化和echarts初始化是否是同步进行

问题根源

bebugger跟踪BMap.Overlay存在,但是他为什么报这个错呢?
整了半天发现初始化地图和初始化echart是异步进行,initMap()echarts.init( document.getElementById("container2"))不在同一个function中
初始化地图比初始化echart慢了几百毫秒,导致加载echarts时地图还没有初始化完成导致错误

解决办法

echarts.init( document.getElementById("container2"))放在initMap()内执行,保证同步

 //初始化地图
    initMap({ BMap, map }) {
      this.BMap = BMap;
      this.map = map;
        //中间echart
      var myChart = (this.chart = echarts.init(
        document.getElementById("container")
      ));
      myChart.setOption(option);
    },

你可能感兴趣的:(vue,echarts,地图echart)