項目中進行圖表信息展示時采用了Eharts的圖表樣式，需要用到地圖展示方式，但是已有的地圖並不能滿足項目的個性化需求，采用地圖圖片的方式既不靈活，也不美觀。ECharts地圖擴展文件使用geoJson格式,制作方式有很多種，我選擇通過shp數據轉換為geojson格式，因為可以通過ArcMap制作自己個性化的shp數據,也就能靈活得到滿足項目需求的geojson數據，制作方式如下：
1、制作shp數據。地理信息行業的人員都對ArcGis和shp格式的數據編輯比較了解，也不是簡單能說清楚的，不再詳細說明。
2、然后利用得到的shp數據轉換為geojson格式，轉換方式和工具也有很多種，我用的是一個在線轉化工具進行數據轉換，地址是：http://mapshaper.org/
3、點擊select選擇剛才制作的shp數據。
4、點擊import，顯示數據。
5、點擊export，選擇geojson格式進行數據導出。
6、導出的geojson數據就可以拿到ECharts中進行自定義地圖展示了。
<meta charset="utf-8">
<title>MyMap</title>
</head>
<body>
<div id="main" style="height: 400px"></div>
<script src="js/echarts.js"></script>
<script src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$.get("js/shandong.json",function(map){
var myChart = echarts.init(document.getElementById('main'));
echarts.registerMap("shandong",map);
var option = {
series : [ {
map : "shandong",
type : "map"
} ]
};
myChart.setOption(option);
});
</script>
顯示界面：
7、這里有一點需要注意，顯示的地圖跟原始數據不太一樣，地圖被縮放的，如果地圖范圍寬度比較窄的數據看起來會很丑，原因是ECharts中地圖顯示設置時有個aspectScale屬性，長寬比默認是0.75。改為1就OK了。
<meta charset="utf-8">
<title>MyMap</title>
</head>
<body>
<div id="main" style="height: 400px"></div>
<script src="js/echarts.js"></script>
<script src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$.get("js/shandong.json",function(map){
var myChart = echarts.init(document.getElementById('main'));
echarts.registerMap("shandong",map);
var option = {
series : [ {
map : "shandong",
type : "map",
aspectScale: 1.0 //長寬比. 默認是: 0.75，所以地圖變形
} ]
};
myChart.setOption(option);
});
</script>
8、修改之后的地圖顯示：
9、好，大功告成，后邊就可以根據客戶需求進行各種美化、應用了。