var data = [
{
name: '北京',
value: 2
}, {
name: '天津',
value: 5
}, {
name: '上海',
value: 1
}, {
name: '重庆',
value: 0
}, {
name: '河北',
value: 0
}, {
name: '河南',
value: 0
}, {
name: '云南',
value: 0
}, {
name: '辽宁',
value: 0
}, {
name: '黑龙江',
value: 0
}, {
name: '湖南',
value: 0
}, {
name: '安徽',
value: 0
}, {
name: '山东',
value: 0
}, {
name: '新疆',
value: 0
}, {
name: '江苏',
value: 0
}, {
name: '浙江',
value: 0
}, {
name: '江西',
value: 0
}, {
name: '湖北',
value: 0
}, {
name: '广西',
value: 0
}, {
name: '甘肃',
value: 0
}, {
name: '山西',
value: 0
}, {
name: '内蒙古',
value: 0
}, {
name: '陕西',
value: 0
}, {
name: '吉林',
value: 5
}, {
name: '福建',
value: 5
}, {
name: '贵州',
value: 15
}, {
name: '广东',
value: 15
}, {
name: '青海',
value: 0
}, {
name: '西藏',
value: 0
}, {
name: '四川',
value: 0
}, {
name: '宁夏',
value: 0
}, {
name: '海南',
value: 0
}]
myChart.setOption({
series: [{
type: 'map',
map: 'china'
}]
})
const tooltipFormatter = function (params) {
console.log(params)
return `<div style="width: 100px;height: 46px;background: #0080EE;position: relative">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAmCAYAAAAxxTAbAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDcuMC1jMDAwIDc5LmRhYmFjYmIsIDIwMjEvMDQvMTQtMDA6Mzk6NDQgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCAyMi40IChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkJDRjgyRDBCRkZBNTExRUI5REVGQkJCQkQ3NEExRkNGIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkJDRjgyRDBDRkZBNTExRUI5REVGQkJCQkQ3NEExRkNGIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QkNGODJEMDlGRkE1MTFFQjlERUZCQkJCRDc0QTFGQ0YiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QkNGODJEMEFGRkE1MTFFQjlERUZCQkJCRDc0QTFGQ0YiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz77Rw6pAAAGA0lEQVR42rxX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" style="width:24px;position: absolute;left: -30px;" alt="">
<div style="width: 100px;height: 46px; background: #0080EE;box-shadow:#0759AA 0 0 10px 2px;border-radius: 10px;">
<div style="font-size: 12px; padding-left:5px;font-family: PingFang;font-weight: 500;color: #FFFFFF;">累计车位数:</div>
<div style="font-size: 16px; padding-left:5px;font-family: DIN;font-weight: bold;color: #FFFFFF;">${params.data.value}</div>
</div>
</div>`
}
var option = {
//地图显示:移动鼠标,显示数据
tooltip: {
trigger: 'item',
showDelay: 0,
transitionDuration: 0.2,
borderWidth: 0,
padding: 0,
formatter: tooltipFormatter
},
//图例
visualMap: {
min: 19000,
max: 70000,
right: 10,
bottom: 40,
showLabel: !0,
textStyle: {
color: 'rgba(167, 194, 240, 1)'
},
pieces: [{
gt: 10,
lt: 20,
label: '投放运营',
color: 'rgba(255, 187, 5, 1)'
}, {
gt: 0,
lt: 10,
label: '战略部署',
color: 'rgba(0, 228, 102, 1)'
}, {
gt: 0,
lt: 0,
label: '',
color: '#00338F'
}],
show: !0
},
toolbox: {
show: false,
orient: 'vertical',
left: 'right',
top: 'center',
feature: {
dataView: {
readOnly: false
},
restore: {},
saveAsImage: {}
}
},
geo: {
map: 'china',
zoom: 1,
label: {
normal: {
show: false,
color: '#000000'
},
emphasis: {
show: false,
color: '#292929'
}
},
roam: true,
itemStyle: {
normal: {
areaColor: '#00338F'
},
}
},
series: [{
type: 'map',
mapType: 'china',
geoIndex: 0,
itemStyle: {
normal: {
color: '#ccc',
areaColor: '#00338F',
borderColor: '#0094D6',
borderWidth: 0.5,
label: {
show: false,
}
},
emphasis: {
areaColor: false,
borderColor: '#00338F',
areaStyle: {
color: '#0094D6'
},
label: {
show: false,
}
}
},
label: {
normal: {
show: false
},
emphasis: {
show: false
}
},
data: data
}]
}