1970年以来中国GDP排名变化情况echarts 地图配置项内容和展示
GDP单位:百万美元
配置项如下
var data=[
{
"time": '3.16',
"data": [
{"name": "China","value":[81116,"中国"]},
{"name": "Italy","value":[24747,"意大利"]},
{"name": "Iran","value":[14991,"伊朗"]},
{"name": "Corea","value":[8236,"韩国"]},
{"name": "Spain","value":[7753,"西班牙"]},
{"name": "France","value":[5380,"法国"]},
{"name": "Germany","value":[4838,"德国"]},
{"name": "United States","value":[1678,"美国"]},
{"name": "United Kingdom","value":[1395,"英国"]},
{"name": "Japan","value":[814,"日本"]}
]
},
{
"time": "3.17",
"data": [
{"name": "China","value":[81151,"中国"]},
{"name": "Italy","value":[27980,"意大利"]},
{"name": "Iran","value":[16169,"伊朗"]},
{"name": "Spain","value":[9191,"西班牙"]},
{"name": "Corea","value":[8320,"韩国"]},
{"name": "France","value":[6573,"法国"]},
{"name": "Germany","value":[6012,"德国"]},
{"name": "United States","value":[3503,"美国"]},
{"name": "United Kingdom","value":[1547,"英国"]},
{"name": "Japan","value":[829,"日本"]}
]
},
{
"time": '3.18',
"data": [
{"name": "China","value":[81235,"中国"]},
{"name": "Italy","value":[31506,"意大利"]},
{"name": "Iran","value":[17361,"伊朗"]},
{"name": "Spain","value":[11178,"西班牙"]},
{"name": "Corea","value":[8413,"韩国"]},
{"name": "France","value":[7652,"法国"]},
{"name": "Germany","value":[7156,"德国"]},
{"name": "United States","value":[3536,"美国"]},
{"name": "United Kingdom","value":[1954,"英国"]},
{"name": "Japan","value":[898,"日本"]}
]
},
{
"time": '3.19',
"data": [
{"name": "China","value":[81300,"中国"]},
{"name": "Italy","value":[35713,"意大利"]},
{"name": "Iran","value":[18407,"伊朗"]},
{"name": "Spain","value":[13716,"西班牙"]},
{"name": "France","value":[9043,"法国"]},
{"name": "Corea","value":[8652,"韩国"]},
{"name": "Germany","value":[8198,"德国"]},
{"name": "United States","value":[7087,"美国"]},
{"name": "United Kingdom","value":[2630,"英国"]},
{"name": "Japan","value":[959,"日本"]}
]
},
{
"time": '3.20',
"data": [
{"name": "China","value":[81416,"中国"]},
{"name": "Italy","value":[47021,"意大利"]},
{"name": "Spain","value":[19980,"西班牙"]},
{"name": "Iran","value":[19644,"伊朗"]},
{"name": "Germany","value":[18323,"德国"]},
{"name": "France","value":[12475,"法国"]},
{"name": "United States","value":[10442,"美国"]},
{"name": "Corea","value":[8799,"韩国"]},
{"name": "United Kingdom","value":[3983,"英国"]},
{"name": "Japan","value":[969,"日本"]}
]
},
{
"time": '3.21',
"data": [
{"name": "China","value":[81498,"中国"]},
{"name": "Italy","value":[53578,"意大利"]},
{"name": "Spain","value":[24926,"西班牙"]},
{"name": "Germany","value":[21463,"德国"]},
{"name": "Iran","value":[20610,"伊朗"]},
{"name": "United States","value":[15219,"美国"]},
{"name": "France","value":[14296,"法国"]},
{"name": "Corea","value":[8897,"韩国"]},
{"name": "United Kingdom","value":[5018,"英国"]},
{"name": "Japan","value":[1054,"日本"]}
]
},
{
"time": '3.22',
"data": [
{"name": "China","value":[81600,"中国"]},
{"name": "Italy","value":[53578,"意大利"]},
{"name": "Spain","value":[24926,"西班牙"]},
{"name": "Iran","value":[21638,"伊朗"]},
{"name": "Germany","value":[21463,"德国"]},
{"name": "United States","value":[15219,"美国"]},
{"name": "France","value":[14296,"法国"]},
{"name": "Corea","value":[8897,"韩国"]},
{"name": "United Kingdom","value":[5018,"英国"]},
{"name": "Turkey","value":[1236,"土耳其"]}
]
},
{
"time": '3.23',
"data": [
{"name": "China","value":[81747,"中国"]},
{"name": "Italy","value":[59138,"意大利"]},
{"name": "United States","value":[31573,"美国"]},
{"name": "Spain","value":[28572,"西班牙"]},
{"name": "Germany","value":[24774,"德国"]},
{"name": "Iran","value":[23049,"伊朗"]},
{"name": "France","value":[15821,"法国"]},
{"name": "Corea","value":[8961,"韩国"]},
{"name": "United Kingdom","value":[5687,"英国"]},
{"name": "Turkey","value":[1529,"土耳其"]}
]
},
{
"time": '3.24',
"data": [
{"name": "China","value":[81847,"中国"]},
{"name": "Italy","value":[63927,"意大利"]},
{"name": "United States","value":[42164,"美国"]},
{"name": "Spain","value":[33089,"西班牙"]},
{"name": "Germany","value":[29212,"德国"]},
{"name": "Iran","value":[24811,"伊朗"]},
{"name": "France","value":[19615,"法国"]},
{"name": "Corea","value":[9037,"韩国"]},
{"name": "United Kingdom","value":[6654,"英国"]},
{"name": "Australia","value":[4486,"澳大利亚"]}
]
},
{
"time": '3.25',
"data": [
{"name": "China","value":[81960,"中国"]},
{"name": "Italy","value":[69176,"意大利"]},
{"name": "United States","value":[51914,"美国"]},
{"name": "Spain","value":[39673,"西班牙"]},
{"name": "Germany","value":[31554,"德国"]},
{"name": "Iran","value":[27017,"伊朗"]},
{"name": "France","value":[22025,"法国"]},
{"name": "Corea","value":[9241,"韩国"]},
{"name": "United Kingdom","value":[8081,"英国"]},
{"name": "Australia","value":[5282,"澳大利亚"]}
]
},
{
"time": '3.26',
"data": [
{"name": "China","value":[82078,"中国"]},
{"name": "Italy","value":[74386,"意大利"]},
{"name": "United States","value":[63570,"美国"]},
{"name": "Spain","value":[47610,"西班牙"]},
{"name": "Germany","value":[36508,"德国"]},
{"name": "Iran","value":[29406,"伊朗"]},
{"name": "France","value":[24920,"法国"]},
{"name": "United Kingdom","value":[9533,"英国"]},
{"name": "Corea","value":[9332,"韩国"]},
{"name": "Turkey","value":[3629,"土耳其"]}
]
},
{
"time": '3.27',
"data": [
{"name": "China","value":[82213,"中国"]},
{"name": "Italy","value":[80539,"意大利"]},
{"name": "United States","value":[68334,"美国"]},
{"name": "Spain","value":[56188,"西班牙"]},
{"name": "Germany","value":[42288,"德国"]},
{"name": "Iran","value":[32332,"伊朗"]},
{"name": "France","value":[28786,"法国"]},
{"name": "United Kingdom","value":[11662,"英国"]},
{"name": "Corea","value":[9332,"韩国"]},
{"name": "Turkey","value":[5698,"土耳其"]}
]
},
{
"time": '3.28',
"data": [
{"name": "Italy","value":[86498,"意大利"]},
{"name": "United States","value":[85228,"美国"]},
{"name": "China","value":[82341,"中国"]},
{"name": "Spain","value":[64059,"西班牙"]},
{"name": "Germany","value":[48582,"德国"]},
{"name": "Iran","value":[35408,"伊朗"]},
{"name": "France","value":[32542,"法国"]},
{"name": "United Kingdom","value":[14547,"英国"]},
{"name": "Corea","value":[9478,"韩国"]},
{"name": "Australia","value":[7697,"澳大利亚"]}
]
},
{
"time": '3.29',
"data": [
{"name": "United States","value":[103321,"美国"]},
{"name": "Italy","value":[92472,"意大利"]},
{"name": "China","value":[82446,"中国"]},
{"name": "Spain","value":[72248,"西班牙"]},
{"name": "Germany","value":[52547,"德国"]},
{"name": "Iran","value":[38309,"伊朗"]},
{"name": "France","value":[37145,"法国"]},
{"name": "United Kingdom","value":[17093,"英国"]},
{"name": "Corea","value":[9583,"韩国"]},
{"name": "Turkey","value":[9217,"土耳其"]}
]
},
{
"time": '3.30',
"data": [
{"name": "United States","value":[122653,"美国"]},
{"name": "Italy","value":[97689,"意大利"]},
{"name": "China","value":[82544,"中国"]},
{"name": "Spain","value":[78797,"西班牙"]},
{"name": "Germany","value":[57298,"德国"]},
{"name": "Iran","value":[41495,"伊朗"]},
{"name": "France","value":[39642,"法国"]},
{"name": "United Kingdom","value":[19526,"英国"]},
{"name": "Corea","value":[9661,"韩国"]},
{"name": "Turkey","value":[9271,"土耳其"]}
]
},
{
"time": '3.31',
"data": [
{"name": "United States","value":[140640,"美国"]},
{"name": "Italy","value":[101739,"意大利"]},
{"name": "Spain","value":[85195,"西班牙"]},
{"name": "China","value":[82630,"中国"]},
{"name": "Germany","value":[61913,"德国"]},
{"name": "Iran","value":[44606,"伊朗"]},
{"name": "France","value":[43977,"法国"]},
{"name": "United Kingdom","value":[22145,"英国"]},
{"name": "Turkey","value":[13531,"土耳其"]},
{"name": "Corea","value":[9887,"韩国"]}
]
}
]
var option = {
baseOption: {
animationDurationUpdate: 1000,
animationEasingUpdate: 'quinticInOut',
timeline: {
show: false,
axisType: 'category',
orient: 'vertical',
autoPlay: true,
inverse: true,
playInterval: 2000,
left: null,
right: 5,
top: 20,
bottom: 20,
width: 46,
height: null,
label: {
normal: {
textStyle: {
color: '#ddd'
}
},
emphasis: {
textStyle: {
color: '#fff'
}
}
},
symbol: 'none',
lineStyle: {
color: '#555'
},
},
backgroundColor: '#404a59',
title: {
text: '3月16日至3月31日世界疫情累计确诊人数前十动态',
subtext: '单位:人',
left: 'center',
top: 'top',
textStyle: {
fontSize: 25,
color: 'rgba(255,255,255, 0.9)'
}
},
grid: {
left: '35%',
right: '30%',
top: '75%',
bottom: 0
},
xAxis: {},
yAxis: {},
series: [
{
id: 'map',
type: 'map',
mapType: 'world',
top: '8%',
bottom: '25%',
left: 0,
itemStyle: {
normal: {
areaColor: '#323c48',
borderColor: '#404a59'
},
emphasis: {
label: {
show: true
},
areaColor: 'rgba(255,255,255, 0.5)'
}
},
data: []
}, {
id: 'bar',
type: 'bar',
tooltip: {
show: false
},
label: {
normal: {
show: true,
position: 'right',
textStyle: {
color: '#ddd'
}
}
},
data: []
},
]
},
options: []
}
for (var i = 0; i < data.length; i++) {
//计算其余国家GDP
option.options.push({
visualMap: [{
show: false,
dimension: 0,
left: '25%',
itemWidth: 12,
min:data[i].data[9].value[0],
max:data[i].data[0].value[0],
text: ['高', '低'],
textStyle: {
color: '#ddd'
},
inRange: {
color: ['lightskyblue', 'yellow', 'orangered', 'red']
}
}],
xAxis: {
type: 'value',
show: false
},
yAxis: {
type: 'category',
show: false
},
series: [
{
id: 'map',
data: data[i].data
}
]
})
}
截图如下
