<!DOCTYPE html>
<head>
<meta charset="utf-8" />
<title>ECharts</title>
<body>
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="main_map" style="height:400px"></div>
<!-- ECharts单文件引入 -->
<script type="text/javascript" src="js/echarts.js"></script>
<script type="text/javascript">
// 路径配置
require.config({
paths: {
echarts: 'http://echarts.baidu.com/build/dist'
}
})
// 使用
require([
'echarts',
'echarts/chart/bar', // 使用柱状图就加载bar模块，按需加载
'echarts/chart/map', // 使用柱状图就加载bar模块，按需加载
'echarts/chart/pie'
], function(ec) {
// 基于准备好的dom，初始化echarts图表
var myChart_map = ec.init(document.getElementById('main_map'))
var itemStyle = {
normal: {
label: {
show: true,
formatter: '{b}',
textStyle: { fontSize: 10, fontWeight: 'bold' }
}
},
emphasis: { label: { show: true } }
}
var option_map = {
title: {
text: 'iphone销量',
subtext: '纯属虚构',
x: 'center'
},
tooltip: {
trigger: 'item'
},
legend: {
orient: 'vertical',
x: 'left',
data: ['iphone3', 'iphone4', 'iphone5']
},
dataRange: {
min: 0,
max: 2500,
x: 'left',
y: 'bottom',
text: ['高', '低'], // 文本，默认为数值文本
calculable: true
},
toolbox: {
show: true,
orient: 'vertical',
x: 'right',
y: 'center',
feature: {
mark: { show: true },
dataView: { show: true, readOnly: false },
restore: { show: true },
saveAsImage: { show: true }
}
},
roamController: {
show: true,
x: 'right',
mapTypeControl: {
china: true
}
},
series: [
{
name: 'iphone3',
type: 'map',
mapType: 'china',
roam: false,
// itemStyle:{
// normal:{label:{show:true}},
// emphasis:{label:{show:true}}
// },
itemStyle: itemStyle,
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: 'iphone4',
type: 'map',
mapType: 'china',
itemStyle: {
normal: { label: { show: true } },
emphasis: { label: { show: true } }
},
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: 'iphone5',
type: 'map',
mapType: 'china',
itemStyle: {
normal: { label: { show: true } },
emphasis: { label: { show: true } }
},
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.roun
基于echarts的中国地图省份数据统计显示
5星 · 超过95%的资源 需积分: 50 192 浏览量
2018-12-07
10:50:46
上传
评论 2
收藏 5.44MB ZIP 举报 
echartsdemo.zip （27个子文件） 
echartsdemo js 
echarts.js 355KB china.js 69KB .DS_Store 6KB .DS_Store 6KB dist echarts.common.js 1.75MB echarts-en.js 2.74MB echarts.js 2.74MB echarts.simple.js 1.17MB extension bmap.min.js 5KB dataTool.js.map 54KB dataTool.min.js 4KB bmap.js 13KB dataTool.js 23KB bmap.js.map 23KB echarts-en.simple.min.js 297KB echarts.js.map 4.86MB echarts.common.min.js 459KB echarts.min.js 727KB echarts.simple.min.js 298KB echarts-en.common.min.js 458KB echarts-en.min.js 726KB echarts-en.js.map 4.86MB echarts-en.simple.js 1.16MB echarts-en.common.js 1.75MB
demo00.html 0B demo.html 8KB dem.html 4KB资源评论
巴蜀明月2023-07-26对于研究中国省份数据的人来说，这个文件是一个很好的工具，可以快速了解各个省份的统计情况。
Jaihwoe2023-07-26这个文件提供了清晰的中国地图省份数据统计显示，让人一目了然。
chenbtravel2023-07-26文件的内容结构清晰，数据呈现方式易于理解，对于初学者来说也很友好。
江水流春去2023-07-26它的界面简洁明了，使用echarts展示数据的方式非常实用。
张匡龙2023-07-26这个文件的价值不仅在于提供数据统计，更在于引发用户对中国地理和经济发展的思考。
