因为之前上一篇博客介绍过，这次权当是做一个补充。本来以为echarts有自己的方法可以默认选择地图并展开选择省的地图，研究过才发现并不是这样的，网上有很多都没有一个完整的代码例子。自己研究下与大家共享了。直接看代码：
<!DOCTYPE html>
<html>
<head>
<title>2.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<!--定义页面图表容器-->
<!-- 必须制定容器的大小（height、width） -->
<div id="main" style="width: 98%; height: 500px; border: 1px solid #ccc; padding: 10px;"></div>
<script type="text/javascript" src="../jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="../echarts-all.js"></script>
<script type="text/javascript">
var myChart = echarts.init(document.getElementById('main'));
option = {
tooltip : {
trigger: 'item'
},
toolbox: {
show : true,
orient: 'vertical',
x:'right',
y:'center',
feature : {
mark : {show: true},
dataView : {show: true, readOnly: false}
}
},
series : [
{
tooltip: {
trigger: 'item',
formatter: '{b}'
},
name: '全国',
type: 'map',
mapType: 'china',
mapLocation: {//显示主地图的位置及其大小
x: 'left',
y: 'top',
width: '50%'
},
roam: false,//地图不允许拖动
selectedMode : 'single',//地图是单选模式
itemStyle:{
normal:{label:{show:true}},
emphasis:{label:{show:true}}
},
data:[
{name: '北京', selected:false},
{name: '天津', selected:false},
{name: '上海', selected:false},
{name: '重庆', selected:false},
{name: '河北', selected:false},
{name: '河南', selected:false},
{name: '云南', selected:false},
{name: '辽宁', selected:false},
{name: '黑龙江', selected:false},
{name: '湖南', selected:false},
{name: '安徽', selected:false},
{name: '山东', selected:false},
{name: '新疆', selected:false},
{name: '江苏', selected:false},
{name: '浙江', selected:false},
{name: '江西', selected:false},
{name: '湖北', selected:false},
{name: '广西', selected:false},
{name: '甘肃', selected:false},
{name: '山西', selected:false},
{name: '内蒙古',selected:false},
{name: '陕西', selected:false},
{name: '吉林', selected:false},
{name: '福建', selected:false},
{name: '贵州', selected:false},
{name: '广东', selected:false},
{name: '青海', selected:false},
{name: '西藏', selected:false},
{name: '四川', selected:false},
{name: '宁夏', selected:false},
{name: '海南', selected:false},
{name: '台湾', selected:false},
{name: '香港', selected:false},
{name: '澳门', selected:false}
]
}
],
animation: false
};
myChart.setOption(option, true); //显示国家地图
//var ecConfig = require('echarts/config');
//myChart.on(ecConfig.EVENT.MAP_SELECTED, function (param){//由于是标签式单文件引入所以这个模块化单文件引入的事件要改变,不能使用require
myChart.on(echarts.config.EVENT.MAP_SELECTED, function (param){//单击省份事件
var selected = param.selected;
var selectedProvince;
var name;
for (var i = 0, l = option.series[0].data.length; i < l; i++) {
name = option.series[0].data[i].name;
option.series[0].data[i].selected = selected[name];
if (selected[name]) {
selectedProvince = name;
}
}
getProvinceMap(selectedProvince);//传递一个省，显示这个省的地图(这是自定义方法)
});
//选择地级市的单击事件
myChart.on(echarts.config.EVENT.CLICK, function (param){
var seriesName=param.seriesName;
if(seriesName.trim()=="居民建档数"||seriesName.trim()==""){//由于全国地图和省地图都要触发这个事件，所以要判断是省还是地级市
alert(param.name);//地级市的名字
}
});
//页面加载完之后默认选择省份以及需要展开的省地图
$().ready(function(){
var selectedProvince="北京";//默认展开北京的地图
for (var i = 0, l = option.series[0].data.length; i < l; i++) {
if(option.series[0].data[i].name==selectedProvince){//循环判断默认被选中
option.series[0].data[i].selected = true;//设置默认选中
break;
}
}
getProvinceMap(selectedProvince);//传递一个省，显示这个省的地图
});
//传递一个省，显示这个省的地图
function getProvinceMap(selectedProvince){
alert(selectedProvince);//所选择省的名字
if (typeof selectedProvince == 'undefined') {
option.series.splice(1);
option.legend = null;
option.dataRange = null;
myChart.setOption(option, true);//如果选择省份不存在则显示国家
return;
}
option.series[1] = {
name: '居民建档数',
type: 'map',
mapType: selectedProvince,
itemStyle:{
normal:{label:{show:true}},//没选择时候省份是否显示
emphasis:{label:{show:true}}//选择之后省份是否显示
},
mapLocation: {//显示子地图的位置及其大小
x: 'right',
y: 'top',
width: '50%'
},
roam: false,//地图不允许拖动
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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)},
{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)}
]
};
option.legend = {
x:'right',
data:['居民建档数']
};
option.dataRange = {
orient: 'horizontal',
x: 'right',
min: 0,
max: 1000,
color:['orange','yellow'],
text:['高','低'], // 文本，默认为数值文本
splitNumber:0
};
myChart.setOption(option, true);//显示省地图
}
</script>
</body>
</html>
特别注意：显示各个的省与市的名字大家不要乱改，否则事件会不起作用，比如：“河北”，代码上面就是“河北”而不是“河北省”就算你改了显示的时候也是显示“河北”，所以很奇怪。
个人认为地域名字在它的echarts-all.js里面已经指定不可改变，之所以还在上文js还有可能仅仅是由于扩展需要，比方显示某个地级市的居民人数，如果你和echarts-all.js不统一则该地级市的居民人数无法显示。
相关推荐
"Echarts省市区/县地图三级下钻"是指利用ECharts实现的中国地图，能够进行省级、市级和区县级的逐级细化展示和交互功能。这种功能常用于地理数据分析、人口统计、销售分布等多种场景，让用户可以方便地查看不同级别...
在本文中，我们将深入探讨如何使用Echarts地图组件在Vue.js环境下实现省市区的下钻展示功能。Echarts是一款强大的、基于JavaScript的数据可视化库，它提供了丰富的图表类型和灵活的交互方式。Vue.js则是一种轻量级的...
公司要做数据大屏，Echart和百度地图的结合，实现利用百度地图的行政区划展示，在行政区区划中添加相应的Echarts散点图，散点图随地图放大和缩小，默认实景图，限制缩放等级，也可展示多个省市区划，代码注释详细，...
在给定的压缩包文件中，我们主要关注的是“百度Echarts中国省市区地图”的相关知识点。 1. **Echarts地图组件**： Echarts中的地图组件允许开发者将地理数据与视觉元素结合，以地图的形式展示数据分布。它支持世界...
本篇将详细介绍ECharts地图中省市地图json文件的使用及相关知识点。 一、ECharts地图概述 ECharts地图组件允许开发者通过JSON格式的数据来绘制中国乃至全球的地图。这些地图数据包含了各个地区的边界信息，包括省、...
在"echarts全国省市地图js.rar"这个压缩包中，我们主要关注的是ECharts如何实现全国省市地图的可视化。 首先，ECharts中的地图图表是通过集成GeoJSON数据来绘制的，GeoJSON是一种地理编码格式，用于存储地理特征，...
在本压缩包文件中，包含的是ECharts3中关于全国及各省市地图数据的JS与JSON格式的资源，这些资源对于在ECharts中绘制中国地图及其下属行政区划非常有用。 首先，我们要理解JS（JavaScript）和JSON（JavaScript ...
然后，在Echarts的配置项中设置`geo`的`map`属性为对应的省份地图，通过`selectMode`设置为"multiple"或"single"来控制用户可以选择一个或多个区域。当用户交互时，通过`on`事件监听用户的点击行为，更新对应的数据...
本资源“echarts全国各省市地图数据”是专为ECharts设计的，用于绘制中国全国各省市的地图。这个压缩包中包含了用于绘制地图所需的js和json数据，使得开发者可以轻松地在网页上展现中国地区的地理分布和相关统计数据...
`projection`部分定义了地图的投影方式，ECharts默认使用的是"mercator"投影。 3. **使用ECharts加载地图JSON** 在ECharts中使用自定义地图，需要在地图初始化时指定`map`属性，并提供地图JSON的URL。例如，加载名...
如果默认的地图数据不满足需求，ECharts还支持自定义地图。这需要提供自定义地图的JSON数据，并在ECharts初始化时通过`geo`组件的`map`属性指定自定义地图名。 5. 动态交互： ECharts地图支持鼠标悬停、点击等...
在ECharts中，地图数据通常以省市区县的行政区域为基础，每个区域都有一个唯一的ID，用于关联相应的数据。 JSON配置文件通常以如下结构组织： ```json { "name": "中国", "type": "geo", "mapType": "china", ...
**ECharts 3 全国省市地图JSON**是ECharts 3版本中用于展示中国所有省份和城市地理信息的一种数据格式。ECharts是一款基于JavaScript的数据可视化库，它提供了丰富的图表类型，灵活的交互功能，以及良好的性能。在...
**全国地图GeoJSON数据在ECharts中的应用** GeoJSON是一种开放的数据格式，常用于地理信息系统，它能够存储地理坐标和几何对象，如点、线、多边形等。在ECharts，一个流行的JavaScript数据可视化库中，GeoJSON数据...
ECharts 默认提供了一些基础地图资源，但可能不包含所有国家和地区的详细数据。如果需要特定的地图资源，可以寻找第三方库或者自定义地图数据。ECharts 社区也有一些开源项目提供额外的地图数据。 6. **案例代码...
ECharts地图组件支持自定义地图，这意味着开发者不仅可以使用默认的中国地图，还可以导入其他国家或地区的地图数据，或者自定义特定区域的地图。 为了在ECharts中使用这些地图数据，你需要做以下步骤： 1. 解压下载...
在“echarts3地图中国省市js”这个主题中，我们主要讨论的是 ECharts 3 版本中关于中国省市地图的 JavaScript 实现。 ECharts 3 提供了强大的地图功能，支持省级、市级甚至区县级的地图展示。这些地图通常以 JSON ...
在提供的压缩包文件中，"Echarts 省市县、区JSON"很可能包含了中国所有省份、城市、县以及区的数据，这些数据通常以JSON格式存储，方便开发者在Echarts图表中绘制中国地图。 JSON（JavaScript Object Notation）是...