echarts 地图区域无法显示

原作者文章传送门 http://blog.youkuaiyun.com/xuelang532777032/article/details/52586628

项目需要画一个全国项目实施状况的统计散点图 , 经推荐使用echarts

于是找了个比较符合要求的官网示例http://echarts.baidu.com/demo.html#scatter-map-brush

然后将官网代码拷到本地测试 ,我的html代码如下:

//引入echarts js
<script type="text/javascript" src="echarts.min.js"></script>
//html组件
<div id="main" style="width:500px;height:500px"></div>
//js代码
<script type="text/javascript">
//1.初始化
var myChart = echarts.init(document.getElementById('main'));
//2.示例页面的demo的拷贝粘贴
var geoCoordMap = {
    "海门":[121.15,31.89],
    ....
    ....
    ....省略N行
3.调用
myChart.setOption(option);
</script>

代码看起来挺对的 ,但就是地图出不来 ,后来查看了 xuelang532777032的文章 ,原来还需要引入 china.js

http://echarts.baidu.com/download-map.html

<script type="text/javascript" src="echarts.min.js"></script>
<script type="text/javascript" src="china.js"></script>