<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ECharts</title>
<script src="echarts.min.js"></script>
<script src="echarts-gl.min.js"></script><!--
<script src="china.js"></script>
</head>
<body>
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="main" style="width: 1000px;height:800px;"></div>
<script type="text/javascript">
var myChart = echarts.init(document.getElementById('main'));
var option = {
backgroundColor: '#302c59',
title: {
text: '全国省份PM2.5含量',
subtext: 'pm2.5的数据',
sublink: 'http://www.pm25.in',
left: 'center',
textStyle: {
color: '#fff'
}
},
tooltip: {
trigger: 'item'
},
roam:false,
visualMap: {
min: 0,
max: 300,
splitNumber: 5,
color: ['red','#d9469f','#d9ea5a','#4855ba','green'],
textStyle: {
color: '#fff',
inRange: ['black', 'red']
}
},
series: [
{
name: 'pm2.5',
type: 'map',
map:'china',
data: [
{name: "上海", value: 25},
{name: "广西", value: 37},
{name: "广东", value: 38},
{name: "云南", value: 39},
{name: "海南", value: 44},
{name: "辽宁", value: 50},
{name: "内蒙古", value: 58},
{name: "四川", value: 58},
{name: "山西", value: 58},
{name: "重庆", value: 66},
{name: "台湾", value: 67},
{name: "江苏", value: 67},
{name: "贵州", value: 71},
{name: "北京", value: 79},
{name: "新疆", value: 84},
{name: "山东", value: 92},
{name: "天津", value: 105},
{name: "黑龙江", value: 114},
{name: "河北", value: 147},
{name: "湖南", value: 175},
{name: "湖北", value: 273},
{name: "西藏", value: 223},
{name: "青海", value: 73},
{name: "甘肃", value: 213},
{name: "河南", value: 73},
{name: "宁夏", value: 73},
{name: "陕西", value: 23},
{name: "江西", value: 203},
{name: "安徽", value: 173},
{name: "浙江", value: 233},
{name: "福建", value: 273},
{name: "吉林", value: 203}
],
label: {
normal: {
show:true
},
emphasis: {
show: true,
color: "#ff276c"
}
},
itemStyle: {
emphasis: {
areaColor:'blue',
borderColor: 'red',
borderWidth: '4'
}
}
}
]
};
myChart.setOption(option);
</script>
</body>
</html>
额外有四个JS包
需要的可以联系我
Processed:
0.009, SQL:
8
