Echart不显示地图问题

Echart不显示地图的问题

使用百度Echart的时候遇到不会显示地图的问题，是现在Echart不直接提供地图需要使用地图的js库或者百度地图来加载地图。

加载地图库

引入世界地图js库

<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/map/js/world.js"></script> 

引入中国地图js库

<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/map/js/china.js"></script> 

配置参数

在引入地图js库以后配置参数，其中map参数为china的时候，为中国地图，map参数为world的时候为世界地图。

<script>
var chart = echarts.init(document.getElementById('main'));
chart.setOption({
    series: [{
        type: 'map',
        map: 'china'
    }]
});
</script>

百度地图

引入百度地图需要去百度地图申请AK http://lbsyun.baidu.com/apiconsole/key

image.png

引入百度地图 ak请使用自己申请的

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=9bdcc7078e2a7c8741e9e17af28a549"></script>

引入bmap控件

<script src="https://cdn.bootcss.com/echarts/3.7.1/extension/bmap.min.js"></script>

可以参考
http://blog.csdn.net/yc_1993/article/details/52431989
配置地图。