一、网址：&& &&& &&& &/download.html点击：&& &&& &&& &完整下载文件：&& &&& &echarts.min.js网址：&& &&& &&& &/download-map.html点击：&& &&& &&& &中国地图 - JS下载文件：&& &&& &china.js二、代码示例
&!DOCTYPE html&
&meta charset="UTF-8"&
&meta http-equiv="X-UA-Compatible" content="IE=EDGE"&
&title&ECharts&/title&
&link rel="stylesheet" type="text/css" href="css/main.css"/&
&script src="js/jquery-1.9.1.min.js"&&/script&
&script src="js/echarts.min.js"&&/script&
&script src="js/china.js"&&/script&
&style&#china-map {width:1000px; height: 1000px;margin: auto;}&/style&
&div id="china-map"&&/div&
var myChart = echarts.init(document.getElementById('china-map'));
var option = {
tooltip: {
show: false //不显示提示标签
formatter: '{b}', //提示标签格式
backgroundColor:"#ff7f50",//提示标签背景颜色
textStyle:{color:"#fff"} //提示标签字体颜色
series: [{
type: 'map',
mapType: 'china',
show: true,//显示省份标签
textStyle:{color:"#c71585"}//省份标签字体颜色
emphasis: {//对应的鼠标悬浮效果
show: true,
textStyle:{color:"#800080"}
itemStyle: {
borderWidth: .<span style="background-color: #f5f5f5; color: #,//区域边框宽度
borderColor: '#009fe8',//区域边框颜色
areaColor:"#ffefd5",//区域颜色
emphasis: {
borderWidth: .<span style="background-color: #f5f5f5; color: #,
borderColor: '#4b0082',
areaColor:"#ffdead",
{name:'福建', selected:true}//福建为选中状态
myChart.setOption(option);
myChart.on('mouseover', function (params) {
var dataIndex = params.dataI
console.log(params);
三、效果图
四、修改省份标签位置：打开china.js文件，修改"properties":{"cp":[X坐标,Y坐标],...}
阅读(...) 评论()}