Toggle navigation
世界疫情分布情况图（多级联动）
By
电***n
2020-06-29 05:05:33
脚本
16
21
作品使用的第三方脚本
数据管理
上传数据
支持小于 5M 任意格式（csv, xlsx, json, xml, ...）的数据文件
上传后可以通过生成的文件链接异步获取托管的数据。
历史数据
0 条
无历史数据
代码修改记录
信息提示
保存作品
对当前截图不满意？你还可以
上传本地截图
重新截图
作品名称
作品描述
标签
geo
grid
legend
markLine
markPoint
bar
effectScatter
line
lines
map
timeline
title
toolbox
tooltip
visualMap
作品默认版本
最新
16
15
14
13
12
11
10
9
8
7
6
5
4
3
2
1
20:11:45
图表已生成
整理代码
刷新
代码
(function(config) { // let chart = echarts.init(document.getElementById("main")); myChart.on('legendselectchanged', function(params) { let options = this.getOption(), keys = Object.keys(params.selected), selected = []; // 获取选中目录的 category 值 for (let item of keys) { if (params.selected[item]) { for (let term of config.level1) if (item == term.name) selected.push(term.category); } } // 根据 category 获取 series 中 data 数据项 options.series[1].data = config.level2.filter(item => { return selected.includes(item.category); }); this.setOption(options); }); myChart.setOption({ tooltip: { trigger: 'item', formatter: "{a} <br/>{b}: {c} ({d}%)" }, legend: { orient: 'horizontal', x: 'center', y: 'bottom', data: ['Americas', 'Europe', 'Eastern Mediterranean', 'Western Pacific', 'South-East Asia', 'Africa'] }, // title: { // text: "80%", // left: "center", // top: "48%", // textStyle: { // color: "#27D9C8", // fontSize: 50, // align: "center" // } // }, graphic: { type: "text", left: "center", top: "48%", style: { text: "全球疫情分布", textAlign: "center", fill: "#333", fontSize: 25, fontWeight: 700 } }, series: [{ name: 'Continent', type: 'pie', label: { normal: { show: true, rotate: true, fontWeight: 'bold', position: 'inner', //这个配置项是控制文案在扇形里显示，或者在扇形中心显示 fontSize: 12 } }, itemStyle: { normal: { borderwidth: 1, borderColor: '#fff', /** * 自定义饼图 扇形 颜色 * @param params */ color(params) { return params.data.color; } } }, // center: ['50%', '50%'], radius: ['30%', '59.5%'], data: config.level1 }, { name: 'countries', type: 'pie', label: { normal: { show: false, //rotate: true, position: 'outer', alignTo: 'edge', margin: '10%', // bleedMargin: 10, // fontSize: 10 } }, itemStyle: { borderwidth: 1, borderColor: '#fff', normal: { color(params) { return params.data.color; } } }, // center: ['50%', '50%'], radius: ['60%', '80%'], data: config.level2 } ] }); })({ "level1": [{ "name": "Americas", "value": 3635043, "category": 0, "color": "#0081A7" }, { "name": "Europe", "value": 2391369, "category": 1, "color": "#00AFB9" }, { "name": "Eastern Mediterranean", "value": 715703, "category": 2, "color": "#FED9B7" }, { "name": "South-East Asia", "value": 422820, "category": 3, "color": "#AED9E0" }, { "name": "Western Pacific", "value": 195414, "category": 4, "color": "#FFA69E" }, { "name": "Africa", "value": 153391, "category": 5, "color": "#F07167" }], "level2": [{ "name": "Saint Kitts and Nevis", "value": 15, "category": 0, "color": "#0081A7" }, { "name": "Dominica", "value": 18, "category": 0, "color": "#0081A7" }, { "name": "Saint Lucia", "value": 19, "category": 0, "color": "#0081A7" }, { "name": "Belize", "value": 20, "category": 0, "color": "#0081A7" }, { "name": "Grenada", "value": 23, "category": 0, "color": "#0081A7" }, { "name": "Antigua and Barbuda", "value": 26, "category": 0, "color": "#0081A7" }, { "name": "Saint Vincent and the Grenadines", "value": 27, "category": 0, "color": "#0081A7" }, { "name": "Barbados", "value": 96, "category": 0, "color": "#0081A7" }, { "name": "Bahamas", "value": 103, "category": 0, "color": "#0081A7" }, { "name": "Trinidad and Tobago", "value": 117, "category": 0, "color": "#0081A7" }, { "name": "Guyana", "value": 158, "category": 0, "color": "#0081A7" }, { "name": "Suriname", "value": 168, "category": 0, "color": "#0081A7" }, { "name": "Jamaica", "value": 611, "category": 0, "color": "#0081A7" }, { "name": "Uruguay", "value": 847, "category": 0, "color": "#0081A7" }, { "name": "Paraguay", "value": 1230, "category": 0, "color": "#0081A7" }, { "name": "Nicaragua", "value": 1464, "category": 0, "color": "#0081A7" }, { "name": "Costa Rica", "value": 1538, "category": 0, "color": "#0081A7" }, { "name": "Cuba", "value": 2219, "category": 0, "color": "#0081A7" }, { "name": "Venezuela", "value": 2814, "category": 0, "color": "#0081A7" }, { "name": "El Salvador", "value": 3373, "category": 0, "color": "#0081A7" }, { "name": "Haiti", "value": 3941, "category": 0, "color": "#0081A7" }, { "name": "Honduras", "value": 7669, "category": 0, "color": "#0081A7" }, { "name": "Guatemala", "value": 8561, "category": 0, "color": "#0081A7" }, { "name": "Bolivia", "value": 16165, "category": 0, "color": "#0081A7" }, { "name": "Panama", "value": 18586, "category": 0, "color": "#0081A7" }, { "name": "Dominican Republic", "value": 21437, "category": 0, "color": "#0081A7" }, { "name": "Argentina", "value": 27373, "category": 0, "color": "#0081A7" }, { "name": "Colombia", "value": 43810, "category": 0, "color": "#0081A7" }, { "name": "Ecuador", "value": 44440, "category": 0, "color": "#0081A7" }, { "name": "Canada", "value": 99146, "category": 0, "color": "#0081A7" }, { "name": "Mexico", "value": 133974, "category": 0, "color": "#0081A7" }, { "name": "Chile", "value": 154092, "category": 0, "color": "#0081A7" }, { "name": "Peru", "value": 214788, "category": 0, "color": "#0081A7" }, { "name": "Brazil", "value": 802828, "category": 0, "color": "#0081A7" }, { "name": "US", "value": 2023347, "category": 0, "color": "#0081A7" }, { "name": "Holy See", "value": 12, "category": 1, "color": "#00AFB9" }, { "name": "Greenland", "value": 13, "category": 1, "color": "#00AFB9" }, { "name": "Liechtenstein", "value": 82, "category": 1, "color": "#00AFB9" }, { "name": "Monaco", "value": 99, "category": 1, "color": "#00AFB9" }, { "name": "Montenegro", "value": 324, "category": 1, "color": "#00AFB9" }, { "name": "Malta", "value": 640, "category": 1, "color": "#00AFB9" }, { "name": "San Marino", "value": 691, "category": 1, "color": "#00AFB9" }, { "name": "Georgia", "value": 831, "category": 1, "color": "#00AFB9" }, { "name": "Andorra", "value": 852, "category": 1, "color": "#00AFB9" }, { "name": "Cyprus", "value": 975, "category": 1, "color": "#00AFB9" }, { "name": "Latvia", "value": 1094, "category": 1, "color": "#00AFB9" }, { "name": "Kosovo", "value": 1326, "category": 1, "color": "#00AFB9" }, { "name": "Albania", "value": 1385, "category": 1, "color": "#00AFB9" }, { "name": "Slovenia", "value": 1488, "category": 1, "color": "#00AFB9" }, { "name": "Slovakia", "value": 1541, "category": 1, "color": "#00AFB9" }, { "name": "Lithuania", "value": 1752, "category": 1, "color": "#00AFB9" }, { "name": "Iceland", "value": 1807, "category": 1, "color": "#00AFB9" }, { "name": "Estonia", "value": 1965, "category": 1, "color": "#00AFB9" }, { "name": "Kyrgyzstan", "value": 2166, "category": 1, "color": "#00AFB9" }, { "name": "Croatia", "value": 2249, "category": 1, "color": "#00AFB9" }, { "name": "Bosnia and Herzegovina", "value": 2832, "category": 1, "color": "#00AFB9" }, { "name": "Bulgaria", "value": 3086, "category": 1, "color": "#00AFB9" }, { "name": "Greece", "value": 3088, "category": 1, "color": "#00AFB9" }, { "name": "North Macedonia", "value": 3538, "category": 1, "color": "#00AFB9" }, { "name": "Hungary", "value": 4039, "category": 1, "color": "#00AFB9" }, { "name": "Luxembourg", "value": 4052, "category": 1, "color": "#00AFB9" }, { "name": "Uzbekistan", "value": 4741, "category": 1, "color": "#00AFB9" }, { "name": "Tajikistan", "value": 4834, "category": 1, "color": "#00AFB9" }, { "name": "Finland", "value": 7064, "category": 1, "color": "#00AFB9" }, { "name": "Norway", "value": 8608, "category": 1, "color": "#00AFB9" }, { "name": "Azerbaijan", "value": 8882, "category": 1, "color": "#00AFB9" }, { "name": "Czechia", "value": 9855, "category": 1, "color": "#00AFB9" }, { "name": "Moldova", "value": 10727, "category": 1, "color": "#00AFB9" }, { "name": "Serbia", "value": 12102, "category": 1, "color": "#00AFB9" }, { "name": "Denmark", "value": 12222, "category": 1, "color": "#00AFB9" }, { "name": "Kazakhstan", "value": 13872, "category": 1, "color": "#00AFB9" }, { "name": "Armenia", "value": 14669, "category": 1, "color": "#00AFB9" }, { "name": "Austria", "value": 17034, "category": 1, "color": "#00AFB9" }, { "name": "Israel", "value": 18569, "category": 1, "color": "#00AFB9" }, { "name": "Romania", "value": 21182, "category": 1, "color": "#00AFB9" }, { "name": "Ireland", "value": 25238, "category": 1, "color": "#00AFB9" }, { "name": "Poland", "value": 28201, "category": 1, "color": "#00AFB9" }, { "name": "Ukraine", "value": 29706, "category": 1, "color": "#00AFB9" }, { "name": "Switzerland", "value": 31044, "category": 1, "color": "#00AFB9" }, { "name": "Portugal", "value": 35910, "category": 1, "color": "#00AFB9" }, { "name": "Sweden", "value": 48288, "category": 1, "color": "#00AFB9" }, { "name": "Netherlands", "value": 48451, "category": 1, "color": "#00AFB9" }, { "name": "Belarus", "value": 51816, "category": 1, "color": "#00AFB9" }, { "name": "Belgium", "value": 59711, "category": 1, "color": "#00AFB9" }, { "name": "Turkey", "value": 174023, "category": 1, "color": "#00AFB9" }, { "name": "Germany", "value": 186691, "category": 1, "color": "#00AFB9" }, { "name": "France", "value": 192493, "category": 1, "color": "#00AFB9" }, { "name": "Italy", "value": 236142, "category": 1, "color": "#00AFB9" }, { "name": "Spain", "value": 242707, "category": 1, "color": "#00AFB9" }, { "name": "United Kingdom", "value": 292860, "category": 1, "color": "#00AFB9" }, { "name": "Russia", "value": 501800, "category": 1, "color": "#00AFB9" }, { "name": "Syria", "value": 164, "category": 2, "color": "#FED9B7" }, { "name": "Libya", "value": 393, "category": 2, "color": "#FED9B7" }, { "name": "West Bank and Gaza", "value": 487, "category": 2, "color": "#FED9B7" }, { "name": "Yemen", "value": 591, "category": 2, "color": "#FED9B7" }, { "name": "Jordan", "value": 890, "category": 2, "color": "#FED9B7" }, { "name": "Tunisia", "value": 1087, "category": 2, "color": "#FED9B7" }, { "name": "Lebanon", "value": 1402, "category": 2, "color": "#FED9B7" }, { "name": "Somalia", "value": 2513, "category": 2, "color": "#FED9B7" }, { "name": "Djibouti", "value": 4398, "category": 2, "color": "#FED9B7" }, { "name": "Sudan", "value": 6730, "category": 2, "color": "#FED9B7" }, { "name": "Morocco", "value": 8537, "category": 2, "color": "#FED9B7" }, { "name": "Bahrain", "value": 16667, "category": 2, "color": "#FED9B7" }, { "name": "Iraq", "value": 16675, "category": 2, "color": "#FED9B7" }, { "name": "Oman", "value": 19954, "category": 2, "color": "#FED9B7" }, { "name": "Afghanistan", "value": 22890, "category": 2, "color": "#FED9B7" }, { "name": "Kuwait", "value": 34432, "category": 2, "color": "#FED9B7" }, { "name": "Egypt", "value": 39726, "category": 2, "color": "#FED9B7" }, { "name": "United Arab Emirates", "value": 40986, "category": 2, "color": "#FED9B7" }, { "name": "Qatar", "value": 75071, "category": 2, "color": "#FED9B7" }, { "name": "Saudi Arabia", "value": 116021, "category": 2, "color": "#FED9B7" }, { "name": "Pakistan", "value": 125933, "category": 2, "color": "#FED9B7" }, { "name": "Iran", "value": 180156, "category": 2, "color": "#FED9B7" }, { "name": "Timor-Leste", "value": 24, "category": 3, "color": "#AED9E0" }, { "name": "Bhutan", "value": 62, "category": 3, "color": "#AED9E0" }, { "name": "Burma", "value": 260, "category": 3, "color": "#AED9E0" }, { "name": "Sri Lanka", "value": 1877, "category": 3, "color": "#AED9E0" }, { "name": "Maldives", "value": 1976, "category": 3, "color": "#AED9E0" }, { "name": "Thailand", "value": 3125, "category": 3, "color": "#AED9E0" }, { "name": "Nepal", "value": 4614, "category": 3, "color": "#AED9E0" }, { "name": "Indonesia", "value": 35295, "category": 3, "color": "#AED9E0" }, { "name": "Bangladesh", "value": 78052, "category": 3, "color": "#AED9E0" }, { "name": "India", "value": 297535, "category": 3, "color": "#AED9E0" }, { "name": "Papua New Guinea", "value": 8, "category": 4, "color": "#FFA69E" }, { "name": "Fiji", "value": 18, "category": 4, "color": "#FFA69E" }, { "name": "Laos", "value": 19, "category": 4, "color": "#FFA69E" }, { "name": "Cambodia", "value": 126, "category": 4, "color": "#FFA69E" }, { "name": "Brunei", "value": 141, "category": 4, "color": "#FFA69E" }, { "name": "Mongolia", "value": 197, "category": 4, "color": "#FFA69E" }, { "name": "Vietnam", "value": 332, "category": 4, "color": "#FFA69E" }, { "name": "Taiwan*", "value": 443, "category": 4, "color": "#FFA69E" }, { "name": "New Zealand", "value": 1504, "category": 4, "color": "#FFA69E" }, { "name": "Australia", "value": 7289, "category": 4, "color": "#FFA69E" }, { "name": "Malaysia", "value": 8369, "category": 4, "color": "#FFA69E" }, { "name": "South Korea", "value": 12003, "category": 4, "color": "#FFA69E" }, { "name": "Japan", "value": 17187, "category": 4, "color": "#FFA69E" }, { "name": "Philippines", "value": 24175, "category": 4, "color": "#FFA69E" }, { "name": "Singapore", "value": 39387, "category": 4, "color": "#FFA69E" }, { "name": "China", "value": 84216, "category": 4, "color": "#FFA69E" }, { "name": "Lesotho", "value": 4, "category": 5, "color": "#F07167" }, { "name": "Western Sahara", "value": 9, "category": 5, "color": "#F07167" }, { "name": "Seychelles", "value": 11, "category": 5, "color": "#F07167" }, { "name": "Gambia", "value": 28, "category": 5, "color": "#F07167" }, { "name": "Namibia", "value": 31, "category": 5, "color": "#F07167" }, { "name": "Eritrea", "value": 41, "category": 5, "color": "#F07167" }, { "name": "Botswana", "value": 48, "category": 5, "color": "#F07167" }, { "name": "Burundi", "value": 85, "category": 5, "color": "#F07167" }, { "name": "Angola", "value": 118, "category": 5, "color": "#F07167" }, { "name": "Comoros", "value": 162, "category": 5, "color": "#F07167" }, { "name": "Benin", "value": 305, "category": 5, "color": "#F07167" }, { "name": "Zimbabwe", "value": 332, "category": 5, "color": "#F07167" }, { "name": "Mauritius", "value": 337, "category": 5, "color": "#F07167" }, { "name": "Liberia", "value": 410, "category": 5, "color": "#F07167" }, { "name": "Eswatini", "value": 449, "category": 5, "color": "#F07167" }, { "name": "Malawi", "value": 481, "category": 5, "color": "#F07167" }, { "name": "Mozambique", "value": 489, "category": 5, "color": "#F07167" }, { "name": "Rwanda", "value": 494, "category": 5, "color": "#F07167" }, { "name": "Tanzania", "value": 509, "category": 5, "color": "#F07167" }, { "name": "Togo", "value": 524, "category": 5, "color": "#F07167" }, { "name": "Sao Tome and Principe", "value": 632, "category": 5, "color": "#F07167" }, { "name": "Cabo Verde", "value": 657, "category": 5, "color": "#F07167" }, { "name": "Uganda", "value": 679, "category": 5, "color": "#F07167" }, { "name": "Congo (Brazzaville)", "value": 728, "category": 5, "color": "#F07167" }, { "name": "Chad", "value": 848, "category": 5, "color": "#F07167" }, { "name": "Burkina Faso", "value": 892, "category": 5, "color": "#F07167" }, { "name": "Niger", "value": 974, "category": 5, "color": "#F07167" }, { "name": "Sierra Leone", "value": 1085, "category": 5, "color": "#F07167" }, { "name": "Zambia", "value": 1200, "category": 5, "color": "#F07167" }, { "name": "Madagascar", "value": 1203, "category": 5, "color": "#F07167" }, { "name": "Equatorial Guinea", "value": 1306, "category": 5, "color": "#F07167" }, { "name": "Guinea-Bissau", "value": 1389, "category": 5, "color": "#F07167" }, { "name": "Mauritania", "value": 1439, "category": 5, "color": "#F07167" }, { "name": "South Sudan", "value": 1670, "category": 5, "color": "#F07167" }, { "name": "Mali", "value": 1722, "category": 5, "color": "#F07167" }, { "name": "Central African Republic", "value": 1952, "category": 5, "color": "#F07167" }, { "name": "Ethiopia", "value": 2670, "category": 5, "color": "#F07167" }, { "name": "Kenya", "value": 3215, "category": 5, "color": "#F07167" }, { "name": "Gabon", "value": 3463, "category": 5, "color": "#F07167" }, { "name": "Guinea", "value": 4372, "category": 5, "color": "#F07167" }, { "name": "Cote d'Ivoire", "value": 4404, "category": 5, "color": "#F07167" }, { "name": "Congo (Kinshasa)", "value": 4515, "category": 5, "color": "#F07167" }, { "name": "Senegal", "value": 4759, "category": 5, "color": "#F07167" }, { "name": "Cameroon", "value": 8681, "category": 5, "color": "#F07167" }, { "name": "Ghana", "value": 10358, "category": 5, "color": "#F07167" }, { "name": "Algeria", "value": 10589, "category": 5, "color": "#F07167" }, { "name": "Nigeria", "value": 14554, "category": 5, "color": "#F07167" }, { "name": "South Africa", "value": 58568, "category": 5, "color": "#F07167" }] });
