一、echarts地图全国地图进省地图

最新推荐文章于 2024-09-10 08:30:11 发布
原创 最新推荐文章于 2024-09-10 08:30:11 发布 · 3.5k 阅读 · 11 ·
本内容遵循CC 4.0 BY-SA版权协议
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

这章讲echarts地图从全国地图进省地图的示范

 1.写一个div

<div id="main" style="height:800px"></div>

2.引入需要的js

<script src="http://echarts.baidu.com/build/dist/echarts.js"></script>

3.编写js

// 路径配置
require.config({
paths: {
echarts: 'http://echarts.baidu.com/build/dist'
}
});


// 使用
require(
[
'echarts',
'echarts/chart/map' // 按地图加载
],
function(ec) {
// 基于准备好的dom，初始化echarts图表
var myChart = ec.init(document.getElementById('main'));
var ecConfig = require('echarts/config');
var zrEvent = require('zrender/tool/event');
var curIndx = 0;
var mapType = [
   //全国
'china',
// 23个省
'广东', '青海', '四川', '海南', '陕西',
'甘肃', '云南', '湖南', '湖北', '黑龙江',
'贵州', '山东', '江西', '河南', '河北',
'山西', '安徽', '福建', '浙江', '江苏',
'吉林', '辽宁', '台湾',
// 5个自治区
'新疆', '广西', '宁夏', '内蒙古', '西藏',
// 4个直辖市
'北京', '天津', '上海', '重庆',
// 2个特别行政区
'香港', '澳门',
];
myChart.on(ecConfig.EVENT.MAP_SELECTED, function(param) {
var len = mapType.length;
var mt = mapType[curIndx % len];
var newmt = param.target;
if(mt == 'china') {
// 全国选择时指定到选中的省份
var selected = param.selected;
for(var i in selected) {
if(selected[i]) {
mt = i;
while(len--) {
if(mapType[len] == mt) {
curIndx = len;
}
}
break;
}
}
option.tooltip.trigger = 'item';
} else {
curIndx = 0;
mt = 'china';
option.tooltip.trigger = 'item';
}
option.series[0].mapType = mt;
option.title.subtext = mt;
myChart.setOption(option, true);
});
option = {
title: {
text: '地图',
subtext: '地图',
x: 'center'
},
tooltip: {
trigger: 'item'
},
legend: {
orient: 'vertical',
x: 'left',
data: ['规划区']
},


dataRange: {
x: 'left',
y: 'bottom',
splitList: [{
start: 100
}, {
start: 85,
end: 100
}, {
start: 65,
end: 85
}, {
start: 45,
end: 65
}, {
start: 25,
end: 45,
}, {
start: 25,
end: 5,
}, {
end: 5
}],
color: ['#D3776C', '#E19E81', '#FBE8A4']
},
toolbox: {
show: true,
orient: 'vertical',
x: 'right',
y: 'center',
},
series: [{
name: '规划区',
type: 'map',
mapType: 'china',
selectedMode: 'single',
itemStyle: {
normal: {
label: { show: true },
textStyle: {
color: "rgb(249, 249, 249)"
}
},
emphasis: { label: { show: true } }
},
data: [
{ name: '湖南', value: Math.round(Math.random() * 100) },
{ name: '湖北', value: Math.round(Math.random() * 100) },
{ name: '广东', value: Math.round(Math.random() * 100) },
{ name: '青海', value: Math.round(Math.random() * 100) },
{ name: '四川', value: Math.round(Math.random() * 100) },
{ name: '海南', value: Math.round(Math.random() * 100) },
{ name: '陕西', value: Math.round(Math.random() * 100) },
{ name: '甘肃', value: Math.round(Math.random() * 100) },
{ name: '云南', value: Math.round(Math.random() * 100) },
{ name: '黑龙江', value: Math.round(Math.random() * 100) },
{ name: '贵州', value: Math.round(Math.random() * 100) },
{ name: '山东', value: Math.round(Math.random() * 100) },
{ name: '江西', value: Math.round(Math.random() * 100) },
{ name: '河南', value: Math.round(Math.random() * 100) },
{ name: '河北', value: Math.round(Math.random() * 100) },
{ name: '山西', value: Math.round(Math.random() * 100) },
{ name: '安徽', value: Math.round(Math.random() * 100) },
{ name: '福建', value: Math.round(Math.random() * 100) },
{ name: '浙江', value: Math.round(Math.random() * 100) },
{ name: '江苏', value: Math.round(Math.random() * 100) },
{ name: '吉林', value: Math.round(Math.random() * 100) },
{ name: '辽宁', value: Math.round(Math.random() * 100) },
{ name: '台湾', value: Math.round(Math.random() * 100) },
{ name: '新疆', value: Math.round(Math.random() * 100) },
{ name: '广西', value: Math.round(Math.random() * 100) },
{ name: '宁夏', value: Math.round(Math.random() * 100) },
{ name: '内蒙古', value: Math.round(Math.random() * 100) },
{ name: '西藏', value: Math.round(Math.random() * 100) },
{ name: '北京', value: Math.round(Math.random() * 100) },
{ name: '天津', value: Math.round(Math.random() * 100) },
{ name: '重庆', value: Math.round(Math.random() * 100) },
{ name: '上海', value: Math.round(Math.random() * 100) },
{ name: '广州', value: Math.round(Math.random() * 100) },
{ name: '北京市', value: Math.round(Math.random() * 100) },
{ name: '天津市', value: Math.round(Math.random() * 100) },
{ name: '上海市', value: Math.round(Math.random() * 100) },
{ name: '香港', value: Math.round(Math.random() * 100) },
{ name: '澳门', value: Math.round(Math.random() * 100) },
{ name: '巴音郭楞蒙古自治州', value: Math.round(Math.random() * 100) },
{ name: '和田地区', value: Math.round(Math.random() * 100) },
{ name: '哈密地区', value: Math.round(Math.random() * 100) },
{ name: '阿克苏地区', value: Math.round(Math.random() * 100) },
{ name: '阿勒泰地区', value: Math.round(Math.random() * 100) },
{ name: '喀什地区', value: Math.round(Math.random() * 100) },
{ name: '塔城地区', value: Math.round(Math.random() * 100) },
{ name: '昌吉回族自治州', value: Math.round(Math.random() * 100) },
{ name: '克孜勒苏柯尔克孜自治州', value: Math.round(Math.random() * 100) },
{ name: '吐鲁番地区', value: Math.round(Math.random() * 100) },
{ name: '伊犁哈萨克自治州', value: Math.round(Math.random() * 100) },
{ name: '博尔塔拉蒙古自治州', value: Math.round(Math.random() * 100) },
{ name: '乌鲁木齐市', value: Math.round(Math.random() * 100) },
{ name: '克拉玛依市', value: Math.round(Math.random() * 100) },
{ name: '阿拉尔市', value: Math.round(Math.random() * 100) },
{ name: '图木舒克市', value: Math.round(Math.random() * 100) },
{ name: '五家渠市', value: Math.round(Math.random() * 100) },
{ name: '石河子市', value: Math.round(Math.random() * 100) },
{ name: '那曲地区', value: Math.round(Math.random() * 100) },
{ name: '阿里地区', value: Math.round(Math.random() * 100) },
{ name: '日喀则地区', value: Math.round(Math.random() * 100) },
{ name: '林芝地区', value: Math.round(Math.random() * 100) },
{ name: '昌都地区', value: Math.round(Math.random() * 100) },
{ name: '山南地区', value: Math.round(Math.random() * 100) },
{ name: '拉萨市', value: Math.round(Math.random() * 100) },
{ name: '呼伦贝尔市', value: Math.round(Math.random() * 100) },
{ name: '阿拉善盟', value: Math.round(Math.random() * 100) },
{ name: '锡林郭勒盟', value: Math.round(Math.random() * 100) },
{ name: '鄂尔多斯市', value: Math.round(Math.random() * 100) },
{ name: '赤峰市', value: Math.round(Math.random() * 100) },
{ name: '巴彦淖尔市', value: Math.round(Math.random() * 100) },
{ name: '通辽市', value: Math.round(Math.random() * 100) },
{ name: '乌兰察布市', value: Math.round(Math.random() * 100) },
{ name: '兴安盟', value: Math.round(Math.random() * 100) },
{ name: '包头市', value: Math.round(Math.random() * 100) },
{ name: '呼和浩特市', value: Math.round(Math.random() * 100) },
{ name: '乌海市', value: Math.round(Math.random() * 100) },
{ name: '海西蒙古族藏族自治州', value: Math.round(Math.random() * 100) },
{ name: '玉树藏族自治州', value: Math.round(Math.random() * 100) },
{ name: '果洛藏族自治州', value: Math.round(Math.random() * 100) },
{ name: '海南藏族自治州', value: Math.round(Math.random() * 100) },
{ name: '海北藏族自治州', value: Math.round(Math.random() * 100) },
{ name: '黄南藏族自治州', value: Math.round(Math.random() * 100) },
{ name: '海东地区', value: Math.round(Math.random() * 100) },
{ name: '西宁市', value: Math.round(Math.random() * 100) },
{ name: '甘孜藏族自治州', value: Math.round(Math.random() * 100) },
{ name: '阿坝藏族羌族自治州', value: Math.round(Math.random() * 100) },
{ name: '凉山彝族自治州', value: Math.round(Math.random() * 100) },
{ name: '绵阳市', value: Math.round(Math.random() * 100) },
{ name: '达州市', value: Math.round(Math.random() * 100) },
{ name: '广元市', value: Math.round(Math.random() * 100) },
{ name: '雅安市', value: Math.round(Math.random() * 100) },
{ name: '宜宾市', value: Math.round(Math.random() * 100) },
{ name: '乐山市', value: Math.round(Math.random() * 100) },
{ name: '南充市', value: Math.round(Math.random() * 100) },
{ name: '巴中市', value: Math.round(Math.random() * 100) },
{ name: '泸州市', value: Math.round(Math.random() * 100) },
{ name: '成都市', value: Math.round(Math.random() * 100) },
{ name: '资阳市', value: Math.round(Math.random() * 100) },
{ name: '攀枝花市', value: Math.round(Math.random() * 100) },
{ name: '眉山市', value: Math.round(Math.random() * 100) },
{ name: '广安市', value: Math.round(Math.random() * 100) },
{ name: '德阳市', value: Math.round(Math.random() * 100) },
{ name: '内江市', value: Math.round(Math.random() * 100) },
{ name: '遂宁市', value: Math.round(Math.random() * 100) },
{ name: '自贡市', value: Math.round(Math.random() * 100) },
{ name: '黑河市', value: Math.round(Math.random() * 100) },
{ name: '大兴安岭地区', value: Math.round(Math.random() * 100) },
{ name: '哈尔滨市', value: Math.round(Math.random() * 100) },
{ name: '齐齐哈尔市', value: Math.round(Math.random() * 100) },
{ name: '牡丹江市', value: Math.round(Math.random() * 100) },
{ name: '绥化市', value: Math.round(Math.random() * 100) },
{ name: '伊春市', value: Math.round(Math.random() * 100) },
{ name: '佳木斯市', value: Math.round(Math.random() * 100) },
{ name: '鸡西市', value: Math.round(Math.random() * 100) },
{ name: '双鸭山市', value: Math.round(Math.random() * 100) },
{ name: '大庆市', value: Math.round(Math.random() * 100) },
{ name: '鹤岗市', value: Math.round(Math.random() * 100) },
{ name: '七台河市', value: Math.round(Math.random() * 100) },
{ name: '酒泉市', value: Math.round(Math.random() * 100) },
{ name: '张掖市', value: Math.round(Math.random() * 100) },
{ name: '甘南藏族自治州', value: Math.round(Math.random() * 100) },
{ name: '武威市', value: Math.round(Math.random() * 100) },
{ name: '陇南市', value: Math.round(Math.random() * 100) },
{ name: '庆阳市', value: Math.round(Math.random() * 100) },
{ name: '白银市', value: Math.round(Math.random() * 100) },
{ name: '定西市', value: Math.round(Math.random() * 100) },
{ name: '天水市', value: Math.round(Math.random() * 100) },
{ name: '兰州市', value: Math.round(Math.random() * 100) },
{ name: '平凉市', value: Math.round(Math.random() * 100) },
{ name: '临夏回族自治州', value: Math.round(Math.random() * 100) },
{ name: '金昌市', value: Math.round(Math.random() * 100) },
{ name: '嘉峪关市', value: Math.round(Math.random() * 100) },
{ name: '普洱市', value: Math.round(Math.random() * 100) },
{ name: '红河哈尼族彝族自治州', value: Math.round(Math.random() * 100) },
{ name: '文山壮族苗族自治州', value: Math.round(Math.random() * 100) },
{ name: '曲靖市', value: Math.round(Math.random() * 100) },
{ name: '楚雄彝族自治州', value: Math.round(Math.random() * 100) },
{ name: '大理白族自治州', value: Math.round(Math.random() * 100) },
{ name: '临沧市', value: Math.round(Math.random() * 100) },
{ name: '迪庆藏族自治州', value: Math.round(Math.random() * 100) },
{ name: '昭通市', value: Math.round(Math.random() * 100) },
{ name: '昆明市', value: Math.round(Math.random() * 100) },
{ name: '丽江市', value: Math.round(Math.random() * 100) },
{ name: '西双版纳傣族自治州', value: Math.round(Math.random() * 100) },
{ name: '保山市', value: Math.round(Math.random() * 100) },
{ name: '玉溪市', value: Math.round(Math.random() * 100) },
{ name: '怒江傈僳族自治州', value: Math.round(Math.random() * 100) },
{ name: '德宏傣族景颇族自治州', value: Math.round(Math.random() * 100) },
{ name: '百色市', value: Math.round(Math.random() * 100) },
{ name: '河池市', value: Math.round(Math.random() * 100) },
{ name: '桂林市', value: Math.round(Math.random() * 100) },
{ name: '南宁市', value: Math.round(Math.random() * 100) },
{ name: '柳州市', value: Math.round(Math.random() * 100) },
{ name: '崇左市', value: Math.round(Math.random() * 100) },
{ name: '来宾市', value: Math.round(Math.random() * 100) },
{ name: '玉林市', value: Math.round(Math.random() * 100) },
{ name: '梧州市', value: Math.round(Math.random() * 100) },
{ name: '贺州市', value: Math.round(Math.random() * 100) },
{ name: '钦州市', value: Math.round(Math.random() * 100) },
{ name: '贵港市', value: Math.round(Math.random() * 100) },
{ name: '防城港市', value: Math.round(Math.random() * 100) },
{ name: '北海市', value: Math.round(Math.random() * 100) },
{ name: '怀化市', value: Math.round(Math.random() * 100) },
{ name: '永州市', value: Math.round(Math.random() * 100) },
{ name: '邵阳市', value: Math.round(Math.random() * 100) },
{ name: '郴州市', value: Math.round(Math.random() * 100) },
{ name: '常德市', value: Math.round(Math.random() * 100) },
{ name: '湘西土家族苗族自治州', value: Math.round(Math.random() * 100) },
{ name: '衡阳市', value: Math.round(Math.random() * 100) },
{ name: '岳阳市', value: Math.round(Math.random() * 100) },
{ name: '益阳市', value: Math.round(Math.random() * 100) },
{ name: '长沙市', value: Math.round(Math.random() * 100) },
{ name: '株洲市', value: Math.round(Math.random() * 100) },
{ name: '张家界市', value: Math.round(Math.random() * 100) },
{ name: '娄底市', value: Math.round(Math.random() * 100) },
{ name: '湘潭市', value: Math.round(Math.random() * 100) },
{ name: '榆林市', value: Math.round(Math.random() * 100) },
{ name: '延安市', value: Math.round(Math.random() * 100) },
{ name: '汉中市', value: Math.round(Math.random() * 100) },
{ name: '安康市', value: Math.round(Math.random() * 100) },
{ name: '商洛市', value: Math.round(Math.random() * 100) },
{ name: '宝鸡市', value: Math.round(Math.random() * 100) },
{ name: '渭南市', value: Math.round(Math.random() * 100) },
{ name: '咸阳市', value: Math.round(Math.random() * 100) },
{ name: '西安市', value: Math.round(Math.random() * 100) },
{ name: '铜川市', value: Math.round(Math.random() * 100) },
{ name: '清远市', value: Math.round(Math.random() * 100) },
{ name: '韶关市', value: Math.round(Math.random() * 100) },
{ name: '湛江市', value: Math.round(Math.random() * 100) },
{ name: '梅州市', value: Math.round(Math.random() * 100) },
{ name: '河源市', value: Math.round(Math.random() * 100) },
{ name: '肇庆市', value: Math.round(Math.random() * 100) },
{ name: '惠州市', value: Math.round(Math.random() * 100) },
{ name: '茂名市', value: Math.round(Math.random() * 100) },
{ name: '江门市', value: Math.round(Math.random() * 100) },
{ name: '阳江市', value: Math.round(Math.random() * 100) },
{ name: '云浮市', value: Math.round(Math.random() * 100) },
{ name: '广州市', value: Math.round(Math.random() * 100) },
{ name: '汕尾市', value: Math.round(Math.random() * 100) },
{ name: '揭阳市', value: Math.round(Math.random() * 100) },
{ name: '珠海市', value: Math.round(Math.random() * 100) },
{ name: '佛山市', value: Math.round(Math.random() * 100) },
{ name: '潮州市', value: Math.round(Math.random() * 100) },
{ name: '汕头市', value: Math.round(Math.random() * 100) },
{ name: '深圳市', value: Math.round(Math.random() * 100) },
{ name: '东莞市', value: Math.round(Math.random() * 100) },
{ name: '中山市', value: Math.round(Math.random() * 100) },
{ name: '延边朝鲜族自治州', value: Math.round(Math.random() * 100) },
{ name: '吉林市', value: Math.round(Math.random() * 100) },
{ name: '白城市', value: Math.round(Math.random() * 100) },
{ name: '松原市', value: Math.round(Math.random() * 100) },
{ name: '长春市', value: Math.round(Math.random() * 100) },
{ name: '白山市', value: Math.round(Math.random() * 100) },
{ name: '通化市', value: Math.round(Math.random() * 100) },
{ name: '四平市', value: Math.round(Math.random() * 100) },
{ name: '辽源市', value: Math.round(Math.random() * 100) },
{ name: '承德市', value: Math.round(Math.random() * 100) },
{ name: '张家口市', value: Math.round(Math.random() * 100) },
{ name: '保定市', value: Math.round(Math.random() * 100) },
{ name: '唐山市', value: Math.round(Math.random() * 100) },
{ name: '沧州市', value: Math.round(Math.random() * 100) },
{ name: '石家庄市', value: Math.round(Math.random() * 100) },
{ name: '邢台市', value: Math.round(Math.random() * 100) },
{ name: '邯郸市', value: Math.round(Math.random() * 100) },
{ name: '秦皇岛市', value: Math.round(Math.random() * 100) },
{ name: '衡水市', value: Math.round(Math.random() * 100) },
{ name: '廊坊市', value: Math.round(Math.random() * 100) },
{ name: '恩施土家族苗族自治州', value: Math.round(Math.random() * 100) },
{ name: '十堰市', value: Math.round(Math.random() * 100) },
{ name: '宜昌市', value: Math.round(Math.random() * 100) },
{ name: '襄樊市', value: Math.round(Math.random() * 100) },
{ name: '黄冈市', value: Math.round(Math.random() * 100) },
{ name: '荆州市', value: Math.round(Math.random() * 100) },
{ name: '荆门市', value: Math.round(Math.random() * 100) },
{ name: '咸宁市', value: Math.round(Math.random() * 100) },
{ name: '随州市', value: Math.round(Math.random() * 100) },
{ name: '孝感市', value: Math.round(Math.random() * 100) },
{ name: '武汉市', value: Math.round(Math.random() * 100) },
{ name: '黄石市', value: Math.round(Math.random() * 100) },
{ name: '神农架林区', value: Math.round(Math.random() * 100) },
{ name: '天门市', value: Math.round(Math.random() * 100) },
{ name: '仙桃市', value: Math.round(Math.random() * 100) },
{ name: '潜江市', value: Math.round(Math.random() * 100) },
{ name: '鄂州市', value: Math.round(Math.random() * 100) },
{ name: '遵义市', value: Math.round(Math.random() * 100) },
{ name: '黔东南苗族侗族自治州', value: Math.round(Math.random() * 100) },
{ name: '毕节地区', value: Math.round(Math.random() * 100) },
{ name: '黔南布依族苗族自治州', value: Math.round(Math.random() * 100) },
{ name: '铜仁地区', value: Math.round(Math.random() * 100) },
{ name: '黔西南布依族苗族自治州', value: Math.round(Math.random() * 100) },
{ name: '六盘水市', value: Math.round(Math.random() * 100) },
{ name: '安顺市', value: Math.round(Math.random() * 100) },
{ name: '贵阳市', value: Math.round(Math.random() * 100) },
{ name: '烟台市', value: Math.round(Math.random() * 100) },
{ name: '临沂市', value: Math.round(Math.random() * 100) },
{ name: '潍坊市', value: Math.round(Math.random() * 100) },
{ name: '青岛市', value: Math.round(Math.random() * 100) },
{ name: '菏泽市', value: Math.round(Math.random() * 100) },
{ name: '济宁市', value: Math.round(Math.random() * 100) },
{ name: '德州市', value: Math.round(Math.random() * 100) },
{ name: '滨州市', value: Math.round(Math.random() * 100) },
{ name: '聊城市', value: Math.round(Math.random() * 100) },
{ name: '东营市', value: Math.round(Math.random() * 100) },
{ name: '济南市', value: Math.round(Math.random() * 100) },
{ name: '泰安市', value: Math.round(Math.random() * 100) },
{ name: '威海市', value: Math.round(Math.random() * 100) },
{ name: '日照市', value: Math.round(Math.random() * 100) },
{ name: '淄博市', value: Math.round(Math.random() * 100) },
{ name: '枣庄市', value: Math.round(Math.random() * 100) },
{ name: '莱芜市', value: Math.round(Math.random() * 100) },
{ name: '赣州市', value: Math.round(Math.random() * 100) },
{ name: '吉安市', value: Math.round(Math.random() * 100) },
{ name: '上饶市', value: Math.round(Math.random() * 100) },
{ name: '九江市', value: Math.round(Math.random() * 100) },
{ name: '抚州市', value: Math.round(Math.random() * 100) },
{ name: '宜春市', value: Math.round(Math.random() * 100) },
{ name: '南昌市', value: Math.round(Math.random() * 100) },
{ name: '景德镇市', value: Math.round(Math.random() * 100) },
{ name: '萍乡市', value: Math.round(Math.random() * 100) },
{ name: '鹰潭市', value: Math.round(Math.random() * 100) },
{ name: '新余市', value: Math.round(Math.random() * 100) },
{ name: '南阳市', value: Math.round(Math.random() * 100) },
{ name: '信阳市', value: Math.round(Math.random() * 100) },
{ name: '洛阳市', value: Math.round(Math.random() * 100) },
{ name: '驻马店市', value: Math.round(Math.random() * 100) },
{ name: '周口市', value: Math.round(Math.random() * 100) },
{ name: '商丘市', value: Math.round(Math.random() * 100) },
{ name: '三门峡市', value: Math.round(Math.random() * 100) },
{ name: '新乡市', value: Math.round(Math.random() * 100) },
{ name: '平顶山市', value: Math.round(Math.random() * 100) },
{ name: '郑州市', value: Math.round(Math.random() * 100) },
{ name: '安阳市', value: Math.round(Math.random() * 100) },
{ name: '开封市', value: Math.round(Math.random() * 100) },
{ name: '焦作市', value: Math.round(Math.random() * 100) },
{ name: '许昌市', value: Math.round(Math.random() * 100) },
{ name: '濮阳市', value: Math.round(Math.random() * 100) },
{ name: '漯河市', value: Math.round(Math.random() * 100) },
{ name: '鹤壁市', value: Math.round(Math.random() * 100) },
{ name: '大连市', value: Math.round(Math.random() * 100) },
{ name: '朝阳市', value: Math.round(Math.random() * 100) },
{ name: '丹东市', value: Math.round(Math.random() * 100) },
{ name: '铁岭市', value: Math.round(Math.random() * 100) },
{ name: '沈阳市', value: Math.round(Math.random() * 100) },
{ name: '抚顺市', value: Math.round(Math.random() * 100) },
{ name: '葫芦岛市', value: Math.round(Math.random() * 100) },
{ name: '阜新市', value: Math.round(Math.random() * 100) },
{ name: '锦州市', value: Math.round(Math.random() * 100) },
{ name: '鞍山市', value: Math.round(Math.random() * 100) },
{ name: '本溪市', value: Math.round(Math.random() * 100) },
{ name: '营口市', value: Math.round(Math.random() * 100) },
{ name: '辽阳市', value: Math.round(Math.random() * 100) },
{ name: '盘锦市', value: Math.round(Math.random() * 100) },
{ name: '忻州市', value: Math.round(Math.random() * 100) },
{ name: '吕梁市', value: Math.round(Math.random() * 100) },
{ name: '临汾市', value: Math.round(Math.random() * 100) },
{ name: '晋中市', value: Math.round(Math.random() * 100) },
{ name: '运城市', value: Math.round(Math.random() * 100) },
{ name: '大同市', value: Math.round(Math.random() * 100) },
{ name: '长治市', value: Math.round(Math.random() * 100) },
{ name: '朔州市', value: Math.round(Math.random() * 100) },
{ name: '晋城市', value: Math.round(Math.random() * 100) },
{ name: '太原市', value: Math.round(Math.random() * 100) },
{ name: '阳泉市', value: Math.round(Math.random() * 100) },
{ name: '六安市', value: Math.round(Math.random() * 100) },
{ name: '安庆市', value: Math.round(Math.random() * 100) },
{ name: '滁州市', value: Math.round(Math.random() * 100) },
{ name: '宣城市', value: Math.round(Math.random() * 100) },
{ name: '阜阳市', value: Math.round(Math.random() * 100) },
{ name: '宿州市', value: Math.round(Math.random() * 100) },
{ name: '黄山市', value: Math.round(Math.random() * 100) },
{ name: '巢湖市', value: Math.round(Math.random() * 100) },
{ name: '亳州市', value: Math.round(Math.random() * 100) },
{ name: '池州市', value: Math.round(Math.random() * 100) },
{ name: '合肥市', value: Math.round(Math.random() * 100) },
{ name: '蚌埠市', value: Math.round(Math.random() * 100) },
{ name: '芜湖市', value: Math.round(Math.random() * 100) },
{ name: '淮北市', value: Math.round(Math.random() * 100) },
{ name: '淮南市', value: Math.round(Math.random() * 100) },
{ name: '马鞍山市', value: Math.round(Math.random() * 100) },
{ name: '铜陵市', value: Math.round(Math.random() * 100) },
{ name: '南平市', value: Math.round(Math.random() * 100) },
{ name: '三明市', value: Math.round(Math.random() * 100) },
{ name: '龙岩市', value: Math.round(Math.random() * 100) },
{ name: '宁德市', value: Math.round(Math.random() * 100) },
{ name: '福州市', value: Math.round(Math.random() * 100) },
{ name: '漳州市', value: Math.round(Math.random() * 100) },
{ name: '泉州市', value: Math.round(Math.random() * 100) },
{ name: '莆田市', value: Math.round(Math.random() * 100) },
{ name: '厦门市', value: Math.round(Math.random() * 100) },
{ name: '丽水市', value: Math.round(Math.random() * 100) },
{ name: '杭州市', value: Math.round(Math.random() * 100) },
{ name: '温州市', value: Math.round(Math.random() * 100) },
{ name: '宁波市', value: Math.round(Math.random() * 100) },
{ name: '舟山市', value: Math.round(Math.random() * 100) },
{ name: '台州市', value: Math.round(Math.random() * 100) },
{ name: '金华市', value: Math.round(Math.random() * 100) },
{ name: '衢州市', value: Math.round(Math.random() * 100) },
{ name: '绍兴市', value: Math.round(Math.random() * 100) },
{ name: '嘉兴市', value: Math.round(Math.random() * 100) },
{ name: '湖州市', value: Math.round(Math.random() * 100) },
{ name: '盐城市', value: Math.round(Math.random() * 100) },
{ name: '徐州市', value: Math.round(Math.random() * 100) },
{ name: '南通市', value: Math.round(Math.random() * 100) },
{ name: '淮安市', value: Math.round(Math.random() * 100) },
{ name: '苏州市', value: Math.round(Math.random() * 100) },
{ name: '宿迁市', value: Math.round(Math.random() * 100) },
{ name: '连云港市', value: Math.round(Math.random() * 100) },
{ name: '扬州市', value: Math.round(Math.random() * 100) },
{ name: '南京市', value: Math.round(Math.random() * 100) },
{ name: '泰州市', value: Math.round(Math.random() * 100) },
{ name: '无锡市', value: Math.round(Math.random() * 100) },
{ name: '常州市', value: Math.round(Math.random() * 100) },
{ name: '镇江市', value: Math.round(Math.random() * 100) },
{ name: '吴忠市', value: Math.round(Math.random() * 100) },
{ name: '中卫市', value: Math.round(Math.random() * 100) },
{ name: '固原市', value: Math.round(Math.random() * 100) },
{ name: '银川市', value: Math.round(Math.random() * 100) },
{ name: '石嘴山市', value: Math.round(Math.random() * 100) },
{ name: '儋州市', value: Math.round(Math.random() * 100) },
{ name: '文昌市', value: Math.round(Math.random() * 100) },
{ name: '乐东黎族自治县', value: Math.round(Math.random() * 100) },
{ name: '三亚市', value: Math.round(Math.random() * 100) },
{ name: '琼中黎族苗族自治县', value: Math.round(Math.random() * 100) },
{ name: '东方市', value: Math.round(Math.random() * 100) },
{ name: '海口市', value: Math.round(Math.random() * 100) },
{ name: '万宁市', value: Math.round(Math.random() * 100) },
{ name: '澄迈县', value: Math.round(Math.random() * 100) },
{ name: '白沙黎族自治县', value: Math.round(Math.random() * 100) },
{ name: '琼海市', value: Math.round(Math.random() * 100) },
{ name: '昌江黎族自治县', value: Math.round(Math.random() * 100) },
{ name: '临高县', value: Math.round(Math.random() * 100) },
{ name: '陵水黎族自治县', value: Math.round(Math.random() * 100) },
{ name: '屯昌县', value: Math.round(Math.random() * 100) },
{ name: '定安县', value: Math.round(Math.random() * 100) },
{ name: '保亭黎族苗族自治县', value: Math.round(Math.random() * 100) },
{ name: '五指山市', value: Math.round(Math.random() * 100) }
]
}]
};


// 为echarts对象加载数据 
myChart.setOption(option);
}
);

//源码：

<!DOCTYPE html>

<head>
	<meta charset="utf-8">
	<title>ECharts</title>
</head>

<body>
	<div id="main" style="height:640px"></div>
	<script src="http://echarts.baidu.com/build/dist/echarts.js"></script>
	<script type="text/javascript">
		// 路径配置
		require.config({
			paths: {
				echarts: 'http://echarts.baidu.com/build/dist'
			}
		});

		// 使用
		require(
			[
				'echarts',
				'echarts/chart/map' // 按地图加载
			],
			function(ec) {
				// 基于准备好的dom，初始化echarts图表
				var myChart = ec.init(document.getElementById('main'));
				var ecConfig = require('echarts/config');
				var zrEvent = require('zrender/tool/event');
				var curIndx = 0;
				var mapType = [
				    //全国
					'china',
					// 23个省
					'广东', '青海', '四川', '海南', '陕西',
					'甘肃', '云南', '湖南', '湖北', '黑龙江',
					'贵州', '山东', '江西', '河南', '河北',
					'山西', '安徽', '福建', '浙江', '江苏',
					'吉林', '辽宁', '台湾',
					// 5个自治区
					'新疆', '广西', '宁夏', '内蒙古', '西藏',
					// 4个直辖市
					'北京', '天津', '上海', '重庆',
					// 2个特别行政区
					'香港', '澳门',
				];
				myChart.on(ecConfig.EVENT.MAP_SELECTED, function(param) {
					var len = mapType.length;
					var mt = mapType[curIndx % len];
					var newmt = param.target;
					if(mt == 'china') {
						// 全国选择时指定到选中的省份
						var selected = param.selected;
						for(var i in selected) {
							if(selected[i]) {
								mt = i;
								while(len--) {
									if(mapType[len] == mt) {
										curIndx = len;
									}
								}
								break;
							}
						}
						option.tooltip.trigger = 'item';
					} else {
						curIndx = 0;
						mt = 'china';
						option.tooltip.trigger = 'item';
					}
					option.series[0].mapType = mt;
					option.title.subtext = mt;
					myChart.setOption(option, true);
				});
				option = {
					title: {
						text: '地图',
						subtext: '地图',
						x: 'center'
					},
					tooltip: {
						trigger: 'item'
					},
					legend: {
						orient: 'vertical',
						x: 'left',
						data: ['规划区']
					},

					dataRange: {
						x: 'left',
						y: 'bottom',
						splitList: [{
							start: 100
						}, {
							start: 85,
							end: 100
						}, {
							start: 65,
							end: 85
						}, {
							start: 45,
							end: 65
						}, {
							start: 25,
							end: 45,
						}, {
							start: 25,
							end: 5,
						}, {
							end: 5
						}],
						color: ['#D3776C', '#E19E81', '#FBE8A4']
					},
					toolbox: {
						show: true,
						orient: 'vertical',
						x: 'right',
						y: 'center',
					},
					series: [{
						name: '规划区',
						type: 'map',
						mapType: 'china',
						selectedMode: 'single',
						itemStyle: {
							normal: {
								label: { show: true },
								textStyle: {
									color: "rgb(249, 249, 249)"
								}
							},
							emphasis: { label: { show: true } }
						},
						data: [
							{ name: '湖南', value: Math.round(Math.random() * 100) },
							{ name: '湖北', value: Math.round(Math.random() * 100) },
							{ name: '广东', value: Math.round(Math.random() * 100) },
							{ name: '青海', value: Math.round(Math.random() * 100) },
							{ name: '四川', value: Math.round(Math.random() * 100) },
							{ name: '海南', value: Math.round(Math.random() * 100) },
							{ name: '陕西', value: Math.round(Math.random() * 100) },
							{ name: '甘肃', value: Math.round(Math.random() * 100) },
							{ name: '云南', value: Math.round(Math.random() * 100) },
							{ name: '黑龙江', value: Math.round(Math.random() * 100) },
							{ name: '贵州', value: Math.round(Math.random() * 100) },
							{ name: '山东', value: Math.round(Math.random() * 100) },
							{ name: '江西', value: Math.round(Math.random() * 100) },
							{ name: '河南', value: Math.round(Math.random() * 100) },
							{ name: '河北', value: Math.round(Math.random() * 100) },
							{ name: '山西', value: Math.round(Math.random() * 100) },
							{ name: '安徽', value: Math.round(Math.random() * 100) },
							{ name: '福建', value: Math.round(Math.random() * 100) },
							{ name: '浙江', value: Math.round(Math.random() * 100) },
							{ name: '江苏', value: Math.round(Math.random() * 100) },
							{ name: '吉林', value: Math.round(Math.random() * 100) },
							{ name: '辽宁', value: Math.round(Math.random() * 100) },
							{ name: '台湾', value: Math.round(Math.random() * 100) },
							{ name: '新疆', value: Math.round(Math.random() * 100) },
							{ name: '广西', value: Math.round(Math.random() * 100) },
							{ name: '宁夏', value: Math.round(Math.random() * 100) },		
							{ name: '内蒙古', value: Math.round(Math.random() * 100) },
							{ name: '西藏', value: Math.round(Math.random() * 100) },
							{ name: '北京', value: Math.round(Math.random() * 100) },
							{ name: '天津', value: Math.round(Math.random() * 100) },
							{ name: '重庆', value: Math.round(Math.random() * 100) },	
							{ name: '上海', value: Math.round(Math.random() * 100) },
							{ name: '广州', value: Math.round(Math.random() * 100) },
							{ name: '北京市', value: Math.round(Math.random() * 100) },
							{ name: '天津市', value: Math.round(Math.random() * 100) },
							{ name: '上海市', value: Math.round(Math.random() * 100) },
							{ name: '香港', value: Math.round(Math.random() * 100) },
							{ name: '澳门', value: Math.round(Math.random() * 100) },
							{ name: '巴音郭楞蒙古自治州', value: Math.round(Math.random() * 100) },
							{ name: '和田地区', value: Math.round(Math.random() * 100) },
							{ name: '哈密地区', value: Math.round(Math.random() * 100) },
							{ name: '阿克苏地区', value: Math.round(Math.random() * 100) },
							{ name: '阿勒泰地区', value: Math.round(Math.random() * 100) },
							{ name: '喀什地区', value: Math.round(Math.random() * 100) },
							{ name: '塔城地区', value: Math.round(Math.random() * 100) },
							{ name: '昌吉回族自治州', value: Math.round(Math.random() * 100) },
							{ name: '克孜勒苏柯尔克孜自治州', value: Math.round(Math.random() * 100) },
							{ name: '吐鲁番地区', value: Math.round(Math.random() * 100) },
							{ name: '伊犁哈萨克自治州', value: Math.round(Math.random() * 100) },
							{ name: '博尔塔拉蒙古自治州', value: Math.round(Math.random() * 100) },
							{ name: '乌鲁木齐市', value: Math.round(Math.random() * 100) },
							{ name: '克拉玛依市', value: Math.round(Math.random() * 100) },
							{ name: '阿拉尔市', value: Math.round(Math.random() * 100) },
							{ name: '图木舒克市', value: Math.round(Math.random() * 100) },
							{ name: '五家渠市', value: Math.round(Math.random() * 100) },
							{ name: '石河子市', value: Math.round(Math.random() * 100) },
							{ name: '那曲地区', value: Math.round(Math.random() * 100) },
							{ name: '阿里地区', value: Math.round(Math.random() * 100) },
							{ name: '日喀则地区', value: Math.round(Math.random() * 100) },
							{ name: '林芝地区', value: Math.round(Math.random() * 100) },
							{ name: '昌都地区', value: Math.round(Math.random() * 100) },
							{ name: '山南地区', value: Math.round(Math.random() * 100) },
							{ name: '拉萨市', value: Math.round(Math.random() * 100) },
							{ name: '呼伦贝尔市', value: Math.round(Math.random() * 100) },
							{ name: '阿拉善盟', value: Math.round(Math.random() * 100) },
							{ name: '锡林郭勒盟', value: Math.round(Math.random() * 100) },
							{ name: '鄂尔多斯市', value: Math.round(Math.random() * 100) },
							{ name: '赤峰市', value: Math.round(Math.random() * 100) },
							{ name: '巴彦淖尔市', value: Math.round(Math.random() * 100) },
							{ name: '通辽市', value: Math.round(Math.random() * 100) },
							{ name: '乌兰察布市', value: Math.round(Math.random() * 100) },
							{ name: '兴安盟', value: Math.round(Math.random() * 100) },
							{ name: '包头市', value: Math.round(Math.random() * 100) },
							{ name: '呼和浩特市', value: Math.round(Math.random() * 100) },
							{ name: '乌海市', value: Math.round(Math.random() * 100) },
							{ name: '海西蒙古族藏族自治州', value: Math.round(Math.random() * 100) },
							{ name: '玉树藏族自治州', value: Math.round(Math.random() * 100) },
							{ name: '果洛藏族自治州', value: Math.round(Math.random() * 100) },
							{ name: '海南藏族自治州', value: Math.round(Math.random() * 100) },
							{ name: '海北藏族自治州', value: Math.round(Math.random() * 100) },
							{ name: '黄南藏族自治州', value: Math.round(Math.random() * 100) },
							{ name: '海东地区', value: Math.round(Math.random() * 100) },
							{ name: '西宁市', value: Math.round(Math.random() * 100) },
							{ name: '甘孜藏族自治州', value: Math.round(Math.random() * 100) },
							{ name: '阿坝藏族羌族自治州', value: Math.round(Math.random() * 100) },
							{ name: '凉山彝族自治州', value: Math.round(Math.random() * 100) },
							{ name: '绵阳市', value: Math.round(Math.random() * 100) },
							{ name: '达州市', value: Math.round(Math.random() * 100) },
							{ name: '广元市', value: Math.round(Math.random() * 100) },
							{ name: '雅安市', value: Math.round(Math.random() * 100) },
							{ name: '宜宾市', value: Math.round(Math.random() * 100) },
							{ name: '乐山市', value: Math.round(Math.random() * 100) },
							{ name: '南充市', value: Math.round(Math.random() * 100) },
							{ name: '巴中市', value: Math.round(Math.random() * 100) },
							{ name: '泸州市', value: Math.round(Math.random() * 100) },
							{ name: '成都市', value: Math.round(Math.random() * 100) },
							{ name: '资阳市', value: Math.round(Math.random() * 100) },
							{ name: '攀枝花市', value: Math.round(Math.random() * 100) },
							{ name: '眉山市', value: Math.round(Math.random() * 100) },
							{ name: '广安市', value: Math.round(Math.random() * 100) },
							{ name: '德阳市', value: Math.round(Math.random() * 100) },
							{ name: '内江市', value: Math.round(Math.random() * 100) },
							{ name: '遂宁市', value: Math.round(Math.random() * 100) },
							{ name: '自贡市', value: Math.round(Math.random() * 100) },
							{ name: '黑河市', value: Math.round(Math.random() * 100) },
							{ name: '大兴安岭地区', value: Math.round(Math.random() * 100) },
							{ name: '哈尔滨市', value: Math.round(Math.random() * 100) },
							{ name: '齐齐哈尔市', value: Math.round(Math.random() * 100) },
							{ name: '牡丹江市', value: Math.round(Math.random() * 100) },
							{ name: '绥化市', value: Math.round(Math.random() * 100) },
							{ name: '伊春市', value: Math.round(Math.random() * 100) },
							{ name: '佳木斯市', value: Math.round(Math.random() * 100) },
							{ name: '鸡西市', value: Math.round(Math.random() * 100) },
							{ name: '双鸭山市', value: Math.round(Math.random() * 100) },
							{ name: '大庆市', value: Math.round(Math.random() * 100) },
							{ name: '鹤岗市', value: Math.round(Math.random() * 100) },
							{ name: '七台河市', value: Math.round(Math.random() * 100) },
							{ name: '酒泉市', value: Math.round(Math.random() * 100) },
							{ name: '张掖市', value: Math.round(Math.random() * 100) },
							{ name: '甘南藏族自治州', value: Math.round(Math.random() * 100) },
							{ name: '武威市', value: Math.round(Math.random() * 100) },
							{ name: '陇南市', value: Math.round(Math.random() * 100) },
							{ name: '庆阳市', value: Math.round(Math.random() * 100) },
							{ name: '白银市', value: Math.round(Math.random() * 100) },
							{ name: '定西市', value: Math.round(Math.random() * 100) },
							{ name: '天水市', value: Math.round(Math.random() * 100) },
							{ name: '兰州市', value: Math.round(Math.random() * 100) },
							{ name: '平凉市', value: Math.round(Math.random() * 100) },
							{ name: '临夏回族自治州', value: Math.round(Math.random() * 100) },
							{ name: '金昌市', value: Math.round(Math.random() * 100) },
							{ name: '嘉峪关市', value: Math.round(Math.random() * 100) },
							{ name: '普洱市', value: Math.round(Math.random() * 100) },
							{ name: '红河哈尼族彝族自治州', value: Math.round(Math.random() * 100) },
							{ name: '文山壮族苗族自治州', value: Math.round(Math.random() * 100) },
							{ name: '曲靖市', value: Math.round(Math.random() * 100) },
							{ name: '楚雄彝族自治州', value: Math.round(Math.random() * 100) },
							{ name: '大理白族自治州', value: Math.round(Math.random() * 100) },
							{ name: '临沧市', value: Math.round(Math.random() * 100) },
							{ name: '迪庆藏族自治州', value: Math.round(Math.random() * 100) },
							{ name: '昭通市', value: Math.round(Math.random() * 100) },
							{ name: '昆明市', value: Math.round(Math.random() * 100) },
							{ name: '丽江市', value: Math.round(Math.random() * 100) },
							{ name: '西双版纳傣族自治州', value: Math.round(Math.random() * 100) },
							{ name: '保山市', value: Math.round(Math.random() * 100) },
							{ name: '玉溪市', value: Math.round(Math.random() * 100) },
							{ name: '怒江傈僳族自治州', value: Math.round(Math.random() * 100) },
							{ name: '德宏傣族景颇族自治州', value: Math.round(Math.random() * 100) },
							{ name: '百色市', value: Math.round(Math.random() * 100) },
							{ name: '河池市', value: Math.round(Math.random() * 100) },
							{ name: '桂林市', value: Math.round(Math.random() * 100) },
							{ name: '南宁市', value: Math.round(Math.random() * 100) },
							{ name: '柳州市', value: Math.round(Math.random() * 100) },
							{ name: '崇左市', value: Math.round(Math.random() * 100) },
							{ name: '来宾市', value: Math.round(Math.random() * 100) },
							{ name: '玉林市', value: Math.round(Math.random() * 100) },
							{ name: '梧州市', value: Math.round(Math.random() * 100) },
							{ name: '贺州市', value: Math.round(Math.random() * 100) },
							{ name: '钦州市', value: Math.round(Math.random() * 100) },
							{ name: '贵港市', value: Math.round(Math.random() * 100) },
							{ name: '防城港市', value: Math.round(Math.random() * 100) },
							{ name: '北海市', value: Math.round(Math.random() * 100) },
							{ name: '怀化市', value: Math.round(Math.random() * 100) },
							{ name: '永州市', value: Math.round(Math.random() * 100) },
							{ name: '邵阳市', value: Math.round(Math.random() * 100) },
							{ name: '郴州市', value: Math.round(Math.random() * 100) },
							{ name: '常德市', value: Math.round(Math.random() * 100) },
							{ name: '湘西土家族苗族自治州', value: Math.round(Math.random() * 100) },
							{ name: '衡阳市', value: Math.round(Math.random() * 100) },
							{ name: '岳阳市', value: Math.round(Math.random() * 100) },
							{ name: '益阳市', value: Math.round(Math.random() * 100) },
							{ name: '长沙市', value: Math.round(Math.random() * 100) },
							{ name: '株洲市', value: Math.round(Math.random() * 100) },
							{ name: '张家界市', value: Math.round(Math.random() * 100) },
							{ name: '娄底市', value: Math.round(Math.random() * 100) },
							{ name: '湘潭市', value: Math.round(Math.random() * 100) },
							{ name: '榆林市', value: Math.round(Math.random() * 100) },
							{ name: '延安市', value: Math.round(Math.random() * 100) },
							{ name: '汉中市', value: Math.round(Math.random() * 100) },
							{ name: '安康市', value: Math.round(Math.random() * 100) },
							{ name: '商洛市', value: Math.round(Math.random() * 100) },
							{ name: '宝鸡市', value: Math.round(Math.random() * 100) },
							{ name: '渭南市', value: Math.round(Math.random() * 100) },
							{ name: '咸阳市', value: Math.round(Math.random() * 100) },
							{ name: '西安市', value: Math.round(Math.random() * 100) },
							{ name: '铜川市', value: Math.round(Math.random() * 100) },
							{ name: '清远市', value: Math.round(Math.random() * 100) },
							{ name: '韶关市', value: Math.round(Math.random() * 100) },
							{ name: '湛江市', value: Math.round(Math.random() * 100) },
							{ name: '梅州市', value: Math.round(Math.random() * 100) },
							{ name: '河源市', value: Math.round(Math.random() * 100) },
							{ name: '肇庆市', value: Math.round(Math.random() * 100) },
							{ name: '惠州市', value: Math.round(Math.random() * 100) },
							{ name: '茂名市', value: Math.round(Math.random() * 100) },
							{ name: '江门市', value: Math.round(Math.random() * 100) },
							{ name: '阳江市', value: Math.round(Math.random() * 100) },
							{ name: '云浮市', value: Math.round(Math.random() * 100) },
							{ name: '广州市', value: Math.round(Math.random() * 100) },
							{ name: '汕尾市', value: Math.round(Math.random() * 100) },
							{ name: '揭阳市', value: Math.round(Math.random() * 100) },
							{ name: '珠海市', value: Math.round(Math.random() * 100) },
							{ name: '佛山市', value: Math.round(Math.random() * 100) },
							{ name: '潮州市', value: Math.round(Math.random() * 100) },
							{ name: '汕头市', value: Math.round(Math.random() * 100) },
							{ name: '深圳市', value: Math.round(Math.random() * 100) },
							{ name: '东莞市', value: Math.round(Math.random() * 100) },
							{ name: '中山市', value: Math.round(Math.random() * 100) },
							{ name: '延边朝鲜族自治州', value: Math.round(Math.random() * 100) },
							{ name: '吉林市', value: Math.round(Math.random() * 100) },
							{ name: '白城市', value: Math.round(Math.random() * 100) },
							{ name: '松原市', value: Math.round(Math.random() * 100) },
							{ name: '长春市', value: Math.round(Math.random() * 100) },
							{ name: '白山市', value: Math.round(Math.random() * 100) },
							{ name: '通化市', value: Math.round(Math.random() * 100) },
							{ name: '四平市', value: Math.round(Math.random() * 100) },
							{ name: '辽源市', value: Math.round(Math.random() * 100) },
							{ name: '承德市', value: Math.round(Math.random() * 100) },
							{ name: '张家口市', value: Math.round(Math.random() * 100) },
							{ name: '保定市', value: Math.round(Math.random() * 100) },
							{ name: '唐山市', value: Math.round(Math.random() * 100) },
							{ name: '沧州市', value: Math.round(Math.random() * 100) },
							{ name: '石家庄市', value: Math.round(Math.random() * 100) },
							{ name: '邢台市', value: Math.round(Math.random() * 100) },
							{ name: '邯郸市', value: Math.round(Math.random() * 100) },
							{ name: '秦皇岛市', value: Math.round(Math.random() * 100) },
							{ name: '衡水市', value: Math.round(Math.random() * 100) },
							{ name: '廊坊市', value: Math.round(Math.random() * 100) },
							{ name: '恩施土家族苗族自治州', value: Math.round(Math.random() * 100) },
							{ name: '十堰市', value: Math.round(Math.random() * 100) },
							{ name: '宜昌市', value: Math.round(Math.random() * 100) },
							{ name: '襄樊市', value: Math.round(Math.random() * 100) },
							{ name: '黄冈市', value: Math.round(Math.random() * 100) },
							{ name: '荆州市', value: Math.round(Math.random() * 100) },
							{ name: '荆门市', value: Math.round(Math.random() * 100) },
							{ name: '咸宁市', value: Math.round(Math.random() * 100) },
							{ name: '随州市', value: Math.round(Math.random() * 100) },
							{ name: '孝感市', value: Math.round(Math.random() * 100) },
							{ name: '武汉市', value: Math.round(Math.random() * 100) },
							{ name: '黄石市', value: Math.round(Math.random() * 100) },
							{ name: '神农架林区', value: Math.round(Math.random() * 100) },
							{ name: '天门市', value: Math.round(Math.random() * 100) },
							{ name: '仙桃市', value: Math.round(Math.random() * 100) },
							{ name: '潜江市', value: Math.round(Math.random() * 100) },
							{ name: '鄂州市', value: Math.round(Math.random() * 100) },
							{ name: '遵义市', value: Math.round(Math.random() * 100) },
							{ name: '黔东南苗族侗族自治州', value: Math.round(Math.random() * 100) },
							{ name: '毕节地区', value: Math.round(Math.random() * 100) },
							{ name: '黔南布依族苗族自治州', value: Math.round(Math.random() * 100) },
							{ name: '铜仁地区', value: Math.round(Math.random() * 100) },
							{ name: '黔西南布依族苗族自治州', value: Math.round(Math.random() * 100) },
							{ name: '六盘水市', value: Math.round(Math.random() * 100) },
							{ name: '安顺市', value: Math.round(Math.random() * 100) },
							{ name: '贵阳市', value: Math.round(Math.random() * 100) },
							{ name: '烟台市', value: Math.round(Math.random() * 100) },
							{ name: '临沂市', value: Math.round(Math.random() * 100) },
							{ name: '潍坊市', value: Math.round(Math.random() * 100) },
							{ name: '青岛市', value: Math.round(Math.random() * 100) },
							{ name: '菏泽市', value: Math.round(Math.random() * 100) },
							{ name: '济宁市', value: Math.round(Math.random() * 100) },
							{ name: '德州市', value: Math.round(Math.random() * 100) },
							{ name: '滨州市', value: Math.round(Math.random() * 100) },
							{ name: '聊城市', value: Math.round(Math.random() * 100) },
							{ name: '东营市', value: Math.round(Math.random() * 100) },
							{ name: '济南市', value: Math.round(Math.random() * 100) },
							{ name: '泰安市', value: Math.round(Math.random() * 100) },
							{ name: '威海市', value: Math.round(Math.random() * 100) },
							{ name: '日照市', value: Math.round(Math.random() * 100) },
							{ name: '淄博市', value: Math.round(Math.random() * 100) },
							{ name: '枣庄市', value: Math.round(Math.random() * 100) },
							{ name: '莱芜市', value: Math.round(Math.random() * 100) },
							{ name: '赣州市', value: Math.round(Math.random() * 100) },
							{ name: '吉安市', value: Math.round(Math.random() * 100) },
							{ name: '上饶市', value: Math.round(Math.random() * 100) },
							{ name: '九江市', value: Math.round(Math.random() * 100) },
							{ name: '抚州市', value: Math.round(Math.random() * 100) },
							{ name: '宜春市', value: Math.round(Math.random() * 100) },
							{ name: '南昌市', value: Math.round(Math.random() * 100) },
							{ name: '景德镇市', value: Math.round(Math.random() * 100) },
							{ name: '萍乡市', value: Math.round(Math.random() * 100) },
							{ name: '鹰潭市', value: Math.round(Math.random() * 100) },
							{ name: '新余市', value: Math.round(Math.random() * 100) },
							{ name: '南阳市', value: Math.round(Math.random() * 100) },
							{ name: '信阳市', value: Math.round(Math.random() * 100) },
							{ name: '洛阳市', value: Math.round(Math.random() * 100) },
							{ name: '驻马店市', value: Math.round(Math.random() * 100) },
							{ name: '周口市', value: Math.round(Math.random() * 100) },
							{ name: '商丘市', value: Math.round(Math.random() * 100) },
							{ name: '三门峡市', value: Math.round(Math.random() * 100) },
							{ name: '新乡市', value: Math.round(Math.random() * 100) },
							{ name: '平顶山市', value: Math.round(Math.random() * 100) },
							{ name: '郑州市', value: Math.round(Math.random() * 100) },
							{ name: '安阳市', value: Math.round(Math.random() * 100) },
							{ name: '开封市', value: Math.round(Math.random() * 100) },
							{ name: '焦作市', value: Math.round(Math.random() * 100) },
							{ name: '许昌市', value: Math.round(Math.random() * 100) },
							{ name: '濮阳市', value: Math.round(Math.random() * 100) },
							{ name: '漯河市', value: Math.round(Math.random() * 100) },
							{ name: '鹤壁市', value: Math.round(Math.random() * 100) },
							{ name: '大连市', value: Math.round(Math.random() * 100) },
							{ name: '朝阳市', value: Math.round(Math.random() * 100) },
							{ name: '丹东市', value: Math.round(Math.random() * 100) },
							{ name: '铁岭市', value: Math.round(Math.random() * 100) },
							{ name: '沈阳市', value: Math.round(Math.random() * 100) },
							{ name: '抚顺市', value: Math.round(Math.random() * 100) },
							{ name: '葫芦岛市', value: Math.round(Math.random() * 100) },
							{ name: '阜新市', value: Math.round(Math.random() * 100) },
							{ name: '锦州市', value: Math.round(Math.random() * 100) },
							{ name: '鞍山市', value: Math.round(Math.random() * 100) },
							{ name: '本溪市', value: Math.round(Math.random() * 100) },
							{ name: '营口市', value: Math.round(Math.random() * 100) },
							{ name: '辽阳市', value: Math.round(Math.random() * 100) },
							{ name: '盘锦市', value: Math.round(Math.random() * 100) },
							{ name: '忻州市', value: Math.round(Math.random() * 100) },
							{ name: '吕梁市', value: Math.round(Math.random() * 100) },
							{ name: '临汾市', value: Math.round(Math.random() * 100) },
							{ name: '晋中市', value: Math.round(Math.random() * 100) },
							{ name: '运城市', value: Math.round(Math.random() * 100) },
							{ name: '大同市', value: Math.round(Math.random() * 100) },
							{ name: '长治市', value: Math.round(Math.random() * 100) },
							{ name: '朔州市', value: Math.round(Math.random() * 100) },
							{ name: '晋城市', value: Math.round(Math.random() * 100) },
							{ name: '太原市', value: Math.round(Math.random() * 100) },
							{ name: '阳泉市', value: Math.round(Math.random() * 100) },
							{ name: '六安市', value: Math.round(Math.random() * 100) },
							{ name: '安庆市', value: Math.round(Math.random() * 100) },
							{ name: '滁州市', value: Math.round(Math.random() * 100) },
							{ name: '宣城市', value: Math.round(Math.random() * 100) },
							{ name: '阜阳市', value: Math.round(Math.random() * 100) },
							{ name: '宿州市', value: Math.round(Math.random() * 100) },
							{ name: '黄山市', value: Math.round(Math.random() * 100) },
							{ name: '巢湖市', value: Math.round(Math.random() * 100) },
							{ name: '亳州市', value: Math.round(Math.random() * 100) },
							{ name: '池州市', value: Math.round(Math.random() * 100) },
							{ name: '合肥市', value: Math.round(Math.random() * 100) },
							{ name: '蚌埠市', value: Math.round(Math.random() * 100) },
							{ name: '芜湖市', value: Math.round(Math.random() * 100) },
							{ name: '淮北市', value: Math.round(Math.random() * 100) },
							{ name: '淮南市', value: Math.round(Math.random() * 100) },
							{ name: '马鞍山市', value: Math.round(Math.random() * 100) },
							{ name: '铜陵市', value: Math.round(Math.random() * 100) },
							{ name: '南平市', value: Math.round(Math.random() * 100) },
							{ name: '三明市', value: Math.round(Math.random() * 100) },
							{ name: '龙岩市', value: Math.round(Math.random() * 100) },
							{ name: '宁德市', value: Math.round(Math.random() * 100) },
							{ name: '福州市', value: Math.round(Math.random() * 100) },
							{ name: '漳州市', value: Math.round(Math.random() * 100) },
							{ name: '泉州市', value: Math.round(Math.random() * 100) },
							{ name: '莆田市', value: Math.round(Math.random() * 100) },
							{ name: '厦门市', value: Math.round(Math.random() * 100) },
							{ name: '丽水市', value: Math.round(Math.random() * 100) },
							{ name: '杭州市', value: Math.round(Math.random() * 100) },
							{ name: '温州市', value: Math.round(Math.random() * 100) },
							{ name: '宁波市', value: Math.round(Math.random() * 100) },
							{ name: '舟山市', value: Math.round(Math.random() * 100) },
							{ name: '台州市', value: Math.round(Math.random() * 100) },
							{ name: '金华市', value: Math.round(Math.random() * 100) },
							{ name: '衢州市', value: Math.round(Math.random() * 100) },
							{ name: '绍兴市', value: Math.round(Math.random() * 100) },
							{ name: '嘉兴市', value: Math.round(Math.random() * 100) },
							{ name: '湖州市', value: Math.round(Math.random() * 100) },
							{ name: '盐城市', value: Math.round(Math.random() * 100) },
							{ name: '徐州市', value: Math.round(Math.random() * 100) },
							{ name: '南通市', value: Math.round(Math.random() * 100) },
							{ name: '淮安市', value: Math.round(Math.random() * 100) },
							{ name: '苏州市', value: Math.round(Math.random() * 100) },
							{ name: '宿迁市', value: Math.round(Math.random() * 100) },
							{ name: '连云港市', value: Math.round(Math.random() * 100) },
							{ name: '扬州市', value: Math.round(Math.random() * 100) },
							{ name: '南京市', value: Math.round(Math.random() * 100) },
							{ name: '泰州市', value: Math.round(Math.random() * 100) },
							{ name: '无锡市', value: Math.round(Math.random() * 100) },
							{ name: '常州市', value: Math.round(Math.random() * 100) },
							{ name: '镇江市', value: Math.round(Math.random() * 100) },
							{ name: '吴忠市', value: Math.round(Math.random() * 100) },
							{ name: '中卫市', value: Math.round(Math.random() * 100) },
							{ name: '固原市', value: Math.round(Math.random() * 100) },
							{ name: '银川市', value: Math.round(Math.random() * 100) },
							{ name: '石嘴山市', value: Math.round(Math.random() * 100) },
							{ name: '儋州市', value: Math.round(Math.random() * 100) },
							{ name: '文昌市', value: Math.round(Math.random() * 100) },
							{ name: '乐东黎族自治县', value: Math.round(Math.random() * 100) },
							{ name: '三亚市', value: Math.round(Math.random() * 100) },
							{ name: '琼中黎族苗族自治县', value: Math.round(Math.random() * 100) },
							{ name: '东方市', value: Math.round(Math.random() * 100) },
							{ name: '海口市', value: Math.round(Math.random() * 100) },
							{ name: '万宁市', value: Math.round(Math.random() * 100) },
							{ name: '澄迈县', value: Math.round(Math.random() * 100) },
							{ name: '白沙黎族自治县', value: Math.round(Math.random() * 100) },
							{ name: '琼海市', value: Math.round(Math.random() * 100) },
							{ name: '昌江黎族自治县', value: Math.round(Math.random() * 100) },
							{ name: '临高县', value: Math.round(Math.random() * 100) },
							{ name: '陵水黎族自治县', value: Math.round(Math.random() * 100) },
							{ name: '屯昌县', value: Math.round(Math.random() * 100) },
							{ name: '定安县', value: Math.round(Math.random() * 100) },
							{ name: '保亭黎族苗族自治县', value: Math.round(Math.random() * 100) },
							{ name: '五指山市', value: Math.round(Math.random() * 100) }
						]
					}]
				};

				// 为echarts对象加载数据 
				myChart.setOption(option);
			}
		);
	</script>
</body>


效果图：



点击湖南进入湖南省地图



点击湖北进入湖北地图


echarts-map点击显示省地图
04-09
通过echarts来显示中国地图和四川地图，点击一下就会进入该地图并且变大
echarts geo3D结合map3D 生成可以点击获取省份信息跳转到相应省份 且地图显示省份名称
weixin_42211507的博客
06-02 3354
1.中国地图使用geo3d 和scatter3D做文字图层，用map3d实现点击可以获取省份信息，如果单独使用geo3d，无法获取到点击的省份信息。还有一些思路写在代码中了。2.对不同省份进行区分（项目涉及到省份排名之类的）；3. 点击进入不同省份 展示各个省份的市区信息；4. 在省份地图上添加marker；
echats图表显示中国地图及各省份城市的展示，可通过点击省份进入城市图表(单图表展示)
最新发布
qq_14852047的博客
09-10 2267
echats图表显示中国地图及各省份城市的展示，可通过点击省份进入城市图表(单图表展示)
vue2 - 使用echarts实现中国地图和点击省份进行查看
尽日寻春不见春，芒鞋踏遍陇头云。归来笑拈梅花嗅，春在枝头已十分。
11-30 1万+
vue使用echarts实现中国地图和点击省份进行查看
echarts实现中国地图、鼠标悬浮、点击跳转对应省市、给省市图标、缩放、拖拽、自适应
weixin_51225684的博客
03-09 1万+
【代码】echarts实现中国地图、鼠标悬浮、点击跳转对应省市、给省市图标、缩放、拖拽、自适应。
echarts显示全国地图（附带全国地图json数据）
weixin_44088179的博客
08-25 1万+
实现echarts全国地图展示，可点击进入省份，可根据经纬度坐标进行位置标记
Echarts实现全国地图展示
m0_59281691的博客
04-16 3691
ECharts是一个使用 JavaScript 实现的开源可视化库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等），底层依赖矢量图形库 ZRender，提供直观，交互丰富，可高度个性化定制的数据可视化图表官方地址。
微信小程序使用echarts显示全国地图
YourNikee的博客
11-17 3041
首先可以看一下echarts官方的实例 也可以直接使用我参照了官方实例的方法： 1、下载echarts小程序组件并放置到具体项目 下载地址 将项目拉到本地之后，找到文件中的 ec-canvas 文件夹，并将其整个复制到你的小程序项目中 我新建了一个component文件夹放置这个组件 2、下载全国地图 链接 打开的网站可以查询全国的所有省市区，暂未验证是否为最新国标库。 搜索你想要的地图节点，选择 JSON API(包含子域)，我这里以全国地图为例 将文本框内的链接复制并在新窗口打开，因为这个文件原本
Echarts使用二：全国地图与各省市地图联动
呜呜哈的博客
08-13 3万+
上篇博客中写到了echarts中如何将城市高亮显示，这篇介绍一下二级地图联动。即点击中国地图中的一个省份，则显示该省份的详细地图。这里的地图使用本地文件引入的方式，网上很多文章介绍的都有问题，根本就无法正确引入地图的js文件。希望这里可以给大家一个正确的示例。 代码有个不足的地方：这里使用两个div分别放置中国地图和点击的省份地图。其实echarts里面提供了内部的布局方法，不过我没有详细去研究，
echart之全国地图切换省级地图
2401_84023579的博客
04-11 1484
city_data:全国所有省包含的市级数据。province_option:全国地图对应的option。city_option:点击显示的省级的地图的option。city_series:市级地图对应是seriesdoc_city_table:市级数据显示在页面的表格的id//地图对应的dom容器，表忘记给其设置长度和宽度返回全国//返回全国地图的按钮，点击切换至全国地图，隐藏省级地图。其次引入地图的js文件（去官网下载最新的地图组件）//我将所有的各个省的js代码整合到一个文件中。
echarts的中国地图，点击进入省级地图，按需加载对应的省js，可返回中国地图
qq_41065593的博客
09-07 6943
原理：创建两个省份的数组，在点击某个省份的时候，遍历获取对应省份的数据js，并加载此数据js，同时重新初始化echarts渲染此省份的数据效果。3.返回国家地图（因为我是外部引入vue写的，直接重新运行国家地图的方法即可）暂时没找到更好的方法，用这种方法也能实现，并且不用一次加载所有省份js。2.echart的点击事件获取对应省份数据。1.省份数组，用于遍历获取对应城市js包。
echarts绘制中国地图，添加标记，点击省份展示市区地图
tt1234561009的博客
08-24 8542
功能描述：页面初始化展示中国地图，并设置了三个省份的标记点，点击省份进入下一级市区地图，再次点击地图回到中国地图。
echarts的中国地图，点击进入省级地图，点击省级地图，返回中国地图
热门推荐
琉夕东流
07-12 4万+
先上效果图，鼠标放上去时的效果，如下图所示：点击进入到的省级地图，如下图所示：中国地图，鼠标放上去时的代码：myChart.on('mouseover', function (params) { var dataIndex = params.dataIndex; // console.log(params); });中国地图的点击事件：myChart.on(...
百度Echarts完全教程（一）
lucahan的博客
10-10 3万+
我感觉我每次写博客都挖坑，这一次保证，真的不挖坑了。。。 这一次要介绍的是百度的一个可视化神器——百度Echarts。 相比较与highcharts，echarts毕竟是国内的，而且完全开源，文档写的也很全，最近我在用echarts做可视化，非常之好用。 目前echarts有2和3两个版本，我更喜欢2。因为2的demo更多，文档写的也全。3的话，我不是很喜欢。不过echarts2和3差别不大
eacharts中国地图省市区点击显示
黑白两客
05-12 890
1.安装echarts.js 相关模块 npm i echarts 2. 在 main.js 文件中搭建全局 // 引入echarts import echarts from 'echarts' Vue.prototype.$echarts = echarts 3.vue文件种引入相关文档 import echarts from "echarts"; import "./china.js"; // 引入中国地图数据 4.隔离相关文档 在 node_modules 文件中查找到 eacharts 下
echart实现中国地图，点击可以显示各省信息
qq_47410017的博客
05-25 1万+
echart实现中国地图，点击可以显示各省信息 文章目录echart实现中国地图，点击可以显示各省信息代码效果准备工作html简单搭建引入地图json数据配置好各省的json数据自动高亮设置鼠标移入移除事件设置鼠标点击事件初始化创建地图前的准备工作（设置小气泡位置）创建地图小广告 代码效果 https://www.makeapie.com/editor.html?c=xp2-DidkB5&v=1 准备工作 在实现中国地图之前可以先下载需要的json数据 在该网站上下载需要的地图json http
echarts 点击省份名称 地图点亮对应省份地图
weixin_44057084的博客
08-23 1739
我们对Markdown编辑器进行了一些功能拓展与语法支持，除了标准的Markdown编辑器功能，我们增加了如下几点新功能，帮助你用它写博客：撤销：Ctrl/Command + Z 重做：Ctrl/Command + Y 加粗：Ctrl/Command + B 斜体：Ctrl/Command + I 标题：Ctrl/Command + Shift + H 无序列表：Ctrl/Command + Shift + U 有序列表：Ctrl/Command + Shift + O 检查列表：Ctrl/Command
echarts.制作中国地图,点击对应的省市链接到该省份的详细介绍
weixin_34319111的博客
01-09 2757
今天花了一天的时间，用echart弄了一个效果，是从中国地图点进去身份并把改省份的数据渲染出来的效果，刚开始完全没有头绪，只能硬着头皮去看百度echart的api，和博客，看了半天，好家伙，终于给我找到了对应的案列，不多说，看代码，这里采用的是echart2的版本 <!DOCTYPE html><html><head><meta charset="utf...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值