此篇先貼一個湖南的:
點擊打開此鏈接搜索你想找的地區http://datav.aliyun.com/tools/atlas/#&lat=30.332329214580188&lng=106.72278672066881&zoom=3.5
復制json后在瀏覽器里打開
緊接著ctrl+a ctrl+c
然后再瀏覽器中搜索出一個json在線決議,將粘貼的內容復制進去,等決議完畢把決議過后的資料復制
在代碼中新建一個js檔案,然后把決議過后的資料粘貼進去,此步驟是為了看清json資料,可以把不需要的資料自行剔除
jquery代碼(需先引入echarts.min.js,以及新建的地圖的js):
需要注意紅框內容需一致
<script type="text/javascript">
echarts.registerMap('hunan1', mapChatDate);//hennanJson名稱取自henan.js里的var henanJson變數名
var chart = echarts.init(document.getElementById('main'));
var dataMap = [{ name: '長沙市' },{ name: '衡陽市' },{name:'郴州市'}];
// chart.setOption({
option={
visualMap: {
min: 170259,
max: 401178,
text: ['max', 'min'],
realtime: false,
calculable: true,
inRange: {
color: ['lightskyblue', 'yellow', 'orangered']
}
},
series: [{
type: 'map',
map: 'hunan1',
itemStyle: {
normal: { label: { show: true } },
emphasis: { label: { show: true } }
},
label: {
normal: {
textStyle: {
fontSize: 16,
// fontWeight: 'bold',
color: 'black'
}
}
},
data: [
{ name: '長沙市', value: 430100 },
{ name: '衡陽市', value: 430400 },
{ name: '郴州市', value: 431000 },
]
}]
}
chart.setOption(option);
// });
// chart.dispatchAction({
// type: 'highlight', // 高亮指定的資料圖形，通過seriesName或者seriesIndex指定系列，如果要再指定某個資料可以再指定dataIndex或者name，
// seriesIndex: 0,
// name: '長沙市'
// })
</script>
最終實作效果圖:
若不想讓自定義地區高亮,洗掉一下代碼即可:
若需要其他地區json,自行搜索:
http://datav.aliyun.com/tools/atlas/#&lat=30.332329214580188&lng=106.72278672066881&zoom=3.5
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/277042.html
標籤：其他
上一篇：jqGrid某行處于編輯狀態,想在點擊jqGrid有排序功能的表頭單元格(即標題行)時讓那行資料保存并讓表格恢復到常規查看狀態
下一篇：angular速成小技巧