以河南地图为例:
代码如下:
<h3>天翼日必达完成率</h3>
<div id="map" style="height:340px; text-align:left; padding:0 20px 20px 20px;"></div>
<script type="text/javascript">
var myChart = echarts.init(document.getElementById(\'map\'));//初始化
myChart.setOption({
title: {
text: \'\'
},
tooltip : {
trigger: \'item\',
/* formatter: \'{b}\',
itemSize:\'14px\'*/
},
/* dataRange: {
orient: \'vertical\',
min: 0,
max: 55000,
text:[\'高\',\'低\'], // 文本,默认为数值文本
splitNumber:0
},*/
dataRange: {
x: \'left\',
y: \'center\',
splitList: [
{start: 0.8, label: \'80%以上\', color: \'#FF6699\'},
{start: 0.6, end: 0.8, label: \'60-80%\', color: \'#CC3300\'},
{start: 0.4, end: 0.6, label: \'40-60%\', color: \'#F7BB37\'},
{start: 0.3, end: 0.4, label: \'30-40%\', color: \'#3BAE56\'},
{start: 0.2, end: 0.3, label: \'20-30%\', color: \'#92D050\'},
{start: 0.1, end: 0.2, label: \'10-20%\', color: \'#3899FF\'},
{start: 0, end: 0.1, label: \'0-10%\', color: \'#BFBFBF\'}
],
textStyle: {
color: \'#3899FF\' // 值域文字颜色
},
selectedMode: false,
color: [\'#E0022B\', \'#E09107\', \'#A3E00B\']
},
series : [
{
name: \'天翼日必达完成率\',
type: \'map\',
mapType: \'河南\',
mapLocation: {
x: \'left\'
},
itemStyle:{
normal:{
label:{show:true}
},
emphasis:{label:{show:true}}
},
data:[
{name:\'郑州市\', value:0.9},
{name:\'开封市\', value:0.6},
{name:\'洛阳市\', value:0.5},
{name:\'平顶山市\', value:0.7},
{name:\'安阳市\', value:0.2},
{name:\'鹤壁市\', value:0.35},
{name:\'新乡市\', value:0.26},
{name:\'焦作市\', value:0.62},
{name:\'濮阳市\', value:0.82},
{name:\'许昌市\', value:0.56},
{name:\'漯河市\', value:0.24},
{name:\'三门峡市\', value:0.32},
{name:\'南阳市\', value:0.29},
{name:\'商丘市\', value:0.42},
{name:\'信阳市\', value:0.22},
{name:\'周口市\', value:0.12},
{name:\'驻马店市\', value:0.42},
{name:\'济源市\', value:0.05}
]
}],
});
</script>
一次真实项目中遇到 记录下 以防忘记。