echart3 湖北地图及如何创建其他省份地图
生活随笔
收集整理的這篇文章主要介紹了
echart3 湖北地图及如何创建其他省份地图
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
剛剛收到一封園友求助echart湖北地圖的郵件，現在將湖北地圖的所有代碼貼到這里，希望可以幫助到更多朋友。
1、首先你得到echarts官網下載js，很多人說找不到，可以到我的git下載（https://github.com/wanghuihui2013/echarts3/tree/master/node_modules/echarts/map/js/province）
2、把echarts.js和hubei.js根據你的路徑引對，然后就可以copy我的代碼咯
3、如果你需要改變地圖的顏色或輪廓線的顏色，請參考我的第一篇文章http://www.cnblogs.com/hhw3/p/6252677.html
4、如果你還需要其他省份的地圖可以copy這個代碼，然后根據我文本中紅色注釋去改即可。
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
</head>
<body>
<div id="main"></div>
</body>
<script src="js/echarts.js"></script>
<script src="js/map/js/province/hubei.js"></script> //如果需要其他省份的地圖只要引入對應省份的js
<script>
var myChart = echarts.init(document.getElementById('main'));
var option = {
title: {
text : '湖北地圖',
subtext : '-。-'
},
tooltip : {
trigger: 'item',
formatter: function(a){
return a[2];
}
},
legend: {
orient: 'vertical',
x:'right',
data:['數據名稱']
},
dataRange: {
min: 0,
max: 1000,
color:['orange','yellow'],
text:['高','低'], // 文本，默認為數值文本
calculable : true
},
series : [
{
name: '數據名稱',
type: 'map',
mapType: '湖北', //改成對應省份名
selectedMode : 'single',
itemStyle:{
normal:{label:{show:true}},
emphasis:{label:{show:true}}
},
//這里的data是輔助改變某個地區顏色的，如果你不需要完全可以不加
data:[
{name: '十堰市',value: Math.round(Math.random()*1000)},
{name: '襄樊市',value: Math.round(Math.random()*1000)},
{name: '隨州市',value: Math.round(Math.random()*1000)},
{name: '神農架林區',value: Math.round(Math.random()*1000)},
{name: '恩師土家族苗族自治州',value: Math.round(Math.random()*1000)},
{name: '宜昌市',value: Math.round(Math.random()*1000)},
{name: '荊門市',value: Math.round(Math.random()*1000)},
{name: '天門市',value: Math.round(Math.random()*1000)},
{name: '潛江市',value: Math.round(Math.random()*1000)},
{name: '荊州市',value: Math.round(Math.random()*1000)},
{name: '仙桃市',value: Math.round(Math.random()*1000)},
{name: '武漢市',value: Math.round(Math.random()*1000)},
{name: '黃岡市',value: Math.round(Math.random()*1000)},
{name: '鄂州市',value: Math.round(Math.random()*1000)},
{name: '咸寧市',value: Math.round(Math.random()*1000)},
{name: '黃石市',value: Math.round(Math.random()*1000)},
]
}
]
};
myChart.setOption(option);
</script>
</html>
如果我有幫助到你請點個贊鼓勵一下我吧！
上述內容是參照echarts官網http://echarts.baidu.com/,若有侵權請聯系，謝謝！
作者：BlancheWang
出處：http://www.cnblogs.com/hhw3
本文版權歸作者和博客園共有，歡迎轉載，但未經作者同意必須保留此段聲明，且在文章頁面明顯位置給出原文連接。
總結
以上是生活随笔為你收集整理的echart3 湖北地图及如何创建其他省份地图的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 《Excel VBA编程开发》附加内容1
- 下一篇： 排队论模型