3d世界地图echarts map3D配置项内容和展示
配置项如下
var textureHdrUrl = '/asset/get/s/data-1631500242783-8x68G3fas.hdr';
var lookupTexture = '/asset/get/s/data-1631502721807-9Dk1xoXBr.png';
var regionData = [
{
name: 'Afghanistan',
value: 0.01,
},
{
name: 'Albania',
value: 2.01,
},
{
name: 'Algeria',
value: 0.15,
},
{
name: 'Andorra',
value: 0.33,
},
{
name: 'Angola',
value: 3.86,
},
{
name: 'Antigua and Barbuda',
value: 5.73,
},
{
name: 'Argentina',
value: 8.4,
},
{
name: 'Armenia',
value: 1.48,
},
{
name: 'Australia',
value: 9.02,
},
{
name: 'Austria',
value: 11.08,
},
{
name: 'Azerbaijan',
value: 4.54,
},
{
name: 'Bahamas',
value: 0.02,
},
{
name: 'Bahrain',
value: 6.98,
},
{
name: 'Bangladesh',
value: 0.0,
},
{
name: 'Barbados',
value: 0.0,
},
{
name: 'Belarus',
value: 5.53,
},
{
name: 'Belgium',
value: 10.63,
},
{
name: 'Belize',
value: 6.25,
},
{
name: 'Benin',
value: 1.29,
},
{
name: 'Bhutan',
value: 0.23,
},
{
name: 'Bolivia',
value: 3.23,
},
{
name: 'Bosnia and Herzegovina',
value: 9.05,
},
{
name: 'Botswana',
value: 4.29,
},
{
name: 'Brazil',
value: 5.76,
},
{
name: 'Brunei Darussalam',
value: 0.12,
},
{
name: 'Bulgaria',
value: 5.86,
},
{
name: 'Burkina Faso',
value: 5.01,
},
{
name: 'Burundi',
value: 9.1,
},
{
name: 'Cambodia',
value: 1.48,
},
{
name: 'Cameroon',
value: 3.77,
},
{
name: 'Canada',
value: 7.8,
},
{
name: 'Cape Verde',
value: 4.78,
},
{
name: 'Central African Republic',
value: 1.53,
},
{
name: 'Chad',
value: 0.31,
},
{
name: 'Chile',
value: 6.6,
},
{
name: 'China',
value: 5.2,
},
{
name: 'Colombia',
value: 5.68,
},
{
name: 'Comoros',
value: 0.31,
},
{
name: 'Congo',
value: 2.6,
},
{
name: 'Cook Islands',
value: 3.73,
},
{
name: 'Costa Rica',
value: 5.65,
},
{
name: "Cote d'Ivoire",
value: 1.77,
},
{
name: 'Croatia',
value: 12.25,
},
{
name: 'Cuba',
value: 2.26,
},
{
name: 'Cyprus',
value: 11.52,
},
{
name: 'Czech Republic',
value: 12.99,
},
{
name: "Democratic People's Republic of Korea",
value: 3.26,
},
{
name: 'Democratic Republic of the Congo',
value: 1.86,
},
{
name: 'Denmark',
value: 11.71,
},
{
name: 'Djibouti',
value: 1.79,
},
{
name: 'Dominica',
value: 7.5,
},
{
name: 'Dominican Republic',
value: 6.66,
},
{
name: 'Ecuador',
value: 2.36,
},
{
name: 'Egypt',
value: 0.21,
},
{
name: 'El Salvador',
value: 3.72,
},
{
name: 'Equatorial Guinea',
value: 3.38,
},
{
name: 'Eritrea',
value: 0.59,
},
{
name: 'Estonia',
value: 9.0,
},
{
name: 'Ethiopia',
value: 0.86,
},
{
name: 'Fiji',
value: 1.72,
},
{
name: 'Finland',
value: 9.31,
},
{
name: 'France',
value: 11.43,
},
{
name: 'Gabon',
value: 8.01,
},
{
name: 'Gambia',
value: 2.59,
},
{
name: 'Georgia',
value: 1.47,
},
{
name: 'Germany',
value: 11.99,
},
{
name: 'Ghana',
value: 1.57,
},
{
name: 'Greece',
value: 9.01,
},
{
name: 'Grenada',
value: 6.67,
},
{
name: 'Guatemala',
value: 1.46,
},
{
name: 'Guinea',
value: 0.2,
},
{
name: 'Guinea-Bissau',
value: 2.19,
},
{
name: 'Guyana',
value: 3.84,
},
{
name: 'Haiti',
value: 8.3,
},
{
name: 'Honduras',
value: 2.92,
},
{
name: 'Hungary',
value: 13.6,
},
{
name: 'Iceland',
value: 6.99,
},
{
name: 'India',
value: 0.29,
},
{
name: 'Indonesia',
value: 0.09,
},
{
name: 'Iran (Islamic Republic of)',
value: 0.0,
},
{
name: 'Iraq',
value: 0.21,
},
{
name: 'Ireland',
value: 13.69,
},
{
name: 'Israel',
value: 2.47,
},
{
name: 'Italy',
value: 8.02,
},
{
name: 'Jamaica',
value: 1.74,
},
{
name: 'Japan',
value: 7.59,
},
{
name: 'Jordan',
value: 0.31,
},
{
name: 'Kazakhstan',
value: 2.96,
},
{
name: 'Kenya',
value: 1.51,
},
{
name: 'Kiribati',
value: 0.45,
},
{
name: 'Kuwait',
value: 0.03,
},
{
name: 'Kyrgyzstan',
value: 3.63,
},
{
name: "Lao People's Democratic Republic",
value: 6.91,
},
{
name: 'Latvia',
value: 9.61,
},
{
name: 'Lebanon',
value: 3.24,
},
{
name: 'Lesotho',
value: 1.82,
},
{
name: 'Liberia',
value: 3.82,
},
{
name: 'Libyan Arab Jamahiriya',
value: 0.01,
},
{
name: 'Lithuania',
value: 9.89,
},
{
name: 'Luxembourg',
value: 15.56,
},
{
name: 'Madagascar',
value: 1.59,
},
{
name: 'Malawi',
value: 1.41,
},
{
name: 'Malaysia',
value: 1.06,
},
{
name: 'Maldives',
value: 0.0,
},
{
name: 'Mali',
value: 0.5,
},
{
name: 'Malta',
value: 6.02,
},
{
name: 'Marshall Islands',
value: 0.0,
},
{
name: 'Mauritania',
value: 0.01,
},
{
name: 'Mauritius',
value: 3.03,
},
{
name: 'Mexico',
value: 4.57,
},
{
name: 'Micronesia (Federated States of)',
value: 1.23,
},
{
name: 'Monaco',
value: 0.0,
},
{
name: 'Mongolia',
value: 2.83,
},
{
name: 'Montenegro',
value: 0.0,
},
{
name: 'Morocco',
value: 0.45,
},
{
name: 'Mozambique',
value: 0.52,
},
{
name: 'Myanmar',
value: 0.33,
},
{
name: 'Namibia',
value: 5.97,
},
{
name: 'Nauru',
value: 0.87,
},
{
name: 'Nepal',
value: 0.19,
},
{
name: 'Netherlands',
value: 9.68,
},
{
name: 'New Zealand',
value: 9.68,
},
{
name: 'Nicaragua',
value: 2.48,
},
{
name: 'Niger',
value: 0.05,
},
{
name: 'Nigeria',
value: 10.57,
},
{
name: 'Niue',
value: 9.47,
},
{
name: 'Norway',
value: 5.5,
},
{
name: 'Oman',
value: 0.26,
},
{
name: 'Pakistan',
value: 0.01,
},
{
name: 'Palau',
value: 0.0,
},
{
name: 'Panama',
value: 5.98,
},
{
name: 'Papua New Guinea',
value: 1.62,
},
{
name: 'Paraguay',
value: 3.73,
},
{
name: 'Peru',
value: 3.83,
},
{
name: 'Philippines',
value: 3.51,
},
{
name: 'Poland',
value: 8.09,
},
{
name: 'Portugal',
value: 11.54,
},
{
name: 'Qatar',
value: 4.4,
},
{
name: 'Republic of Korea',
value: 7.87,
},
{
name: 'Republic of Moldova',
value: 13.18,
},
{
name: 'Romania',
value: 9.74,
},
{
name: 'Rwanda',
value: 6.93,
},
{
name: 'Saint Kitts and Nevis',
value: 6.73,
},
{
name: 'Saint Lucia',
value: 11.48,
},
{
name: 'Saint Vincent and the Grenadines',
value: 7.0,
},
{
name: 'Samoa',
value: 1.73,
},
{
name: 'San Marino',
value: 0.0,
},
{
name: 'Sao Tome and Principe',
value: 6.95,
},
{
name: 'Saudi Arabia',
value: 0.0,
},
{
name: 'Senegal',
value: 0.46,
},
{
name: 'Serbia',
value: 0.0,
},
{
name: 'Seychelles',
value: '3.36',
},
{
name: 'Sierra Leone',
value: 6.39,
},
{
name: 'Singapore',
value: 2.17,
},
{
name: 'Slovakia',
value: 10.35,
},
{
name: 'Slovenia',
value: 6.74,
},
{
name: 'Solomon Islands',
value: 0.97,
},
{
name: 'Somalia',
value: 0.0,
},
{
name: 'South Africa',
value: 6.72,
},
{
name: 'Spain',
value: 11.68,
},
{
name: 'Sri Lanka',
value: 0.28,
},
{
name: 'Sudan',
value: 0.3,
},
{
name: 'Suriname',
value: 0.0,
},
{
name: 'Swaziland',
value: 4.6,
},
{
name: 'Sweden',
value: 5.96,
},
{
name: 'Switzerland',
value: 10.83,
},
{
name: 'Tajikistan',
value: 0.39,
},
{
name: 'Thailand',
value: 5.59,
},
{
name: 'Timor-Leste',
value: 0.0,
},
{
name: 'Togo',
value: 1.24,
},
{
name: 'Tonga',
value: 0.75,
},
{
name: 'Trinidad and Tobago',
value: 4.17,
},
{
name: 'Tunisia',
value: 1.23,
},
{
name: 'Turkey',
value: 1.37,
},
{
name: 'Turkmenistan',
value: 1.18,
},
{
name: 'Tuvalu',
value: 1.37,
},
{
name: 'Uganda',
value: 0.0,
},
{
name: 'Ukraine',
value: 6.09,
},
{
name: 'United Arab Emirates',
value: 0.02,
},
{
name: 'United Kingdom',
value: 11.75,
},
{
name: 'Uruguay',
value: 7.74,
},
{
name: 'Uzbekistan',
value: 1.51,
},
{
name: 'Vanuatu',
value: 0.75,
},
{
name: 'Venezuela',
value: 6.67,
},
{
name: 'Viet Nam',
value: 0.85,
},
{
name: 'Yemen',
value: 0.04,
},
{
name: 'Zambia',
value: 2.4,
},
{
name: 'Zimbabwe',
value: 4.41,
},
{
name: 'United States',
value: 8.61,
},
{
name: 'Tanzania',
value: 5.45,
},
{
name: 'Macedonia',
value: 5.69,
},
{
name: 'Syria',
value: 0.49,
},
{
name: 'Russia',
value: 10.32,
},
];
var minHeight = 2;
var maxHeight = 4;
var heightLen = maxHeight - minHeight;
var minVal, maxVal, len;
function handleData(data) {
var result = [...data];
result.sort(function (a, b) {
return a.value - b.value;
});
minVal = result[0].value;
maxVal = result[result.length - 1].value;
len = maxVal - minVal;
result.forEach(function (item, index) {
var value = item.value;
item.height = ((value - minVal) / len) * heightLen + minHeight;
});
return result;
}
option = {
series: [
{
type: 'map3D',
map: 'world',
boxHeight: maxHeight,
light: {
main: {
intensity: 1,
shadow: true,
alpha: 120,
beta: 45,
},
ambient: {
intensity: 0,
},
ambientCubemap: {
diffuseIntensity: 1,
texture: textureHdrUrl,
},
},
postEffect: {
enable: true,
colorCorrection: {
lookupTexture: lookupTexture,
},
},
groundPlane: {
show: true,
},
viewControl: {
distance: 90,
rotateSensitivity: 1,
zoomSensitivity: 1,
alpha: 75,
},
data: handleData(regionData),
},
],
visualMap: {
show: false,
min: 0,
max: 15,
inRange: {
color: [
'#313695',
'#4575b4',
'#74add1',
'#abd9e9',
'#e0f3f8',
'#ffffbf',
'#fee090',
'#fdae61',
'#f46d43',
'#d73027',
'#a50026',
],
},
},
};
截图如下
