var dataMaps = [ { name: '北京', value: 0 }, { name: '天津', value: 0 }, { name: '河北', value: 0 }, { name: '山西', value: 0 }, { name: '内蒙古', value: 0 }, { name: '辽宁', value: 0 }, { name: '吉林', value: 0 }, { name: '黑龙江', value: 0 }, { name: '上海', value: 0 }, { name: '江苏', value: 0 }, { name: '浙江', value: 0 }, { name: '安徽', value: 0 }, { name: '福建', value: 0 }, { name: '江西', value: 0 }, { name: '山东', value: 0 }, { name: '河南', value: 0 }, { name: '湖北', value: 0 }, { name: '湖南', value: 0 }, { name: '重庆', value: 0 }, { name: '四川', value: 0 }, { name: '贵州', value: 0 }, { name: '云南', value: 0 }, { name: '西藏', value: 0 }, { name: '陕西', value: 0 }, { name: '甘肃', value: 0 }, { name: '青海', value: 0 }, { name: '宁夏', value: 0 }, { name: '新疆', value: 0 }, { name: '广东', value: 0 }, { name: '广西', value: 0 }, { name: '海南', value: 0 }, { name: '台湾', value: 0 }, ]; dataMaps.forEach((item) => { let d = (Math.random() * 300).toFixed(0); item.value = d; item.height = d / 100; return item; }); console.log(dataMaps); let geoCoordMap = { 海门: [121.15, 31.89], 鄂尔多斯: [109.781327, 39.608266], 招远: [120.38, 37.35], 舟山: [122.207216, 29.985295], 齐齐哈尔: [123.97, 47.33], 盐城: [120.13, 33.38], 赤峰: [118.87, 42.28], 青岛: [120.33, 36.07], 乳山: [121.52, 36.89], 金昌: [102.188043, 38.520089], 泉州: [118.58, 24.93], 莱西: [120.53, 36.86], 日照: [119.46, 35.42], 胶南: [119.97, 35.88], 南通: [121.05, 32.08], 拉萨: [91.11, 29.97], 云浮: [112.02, 22.93], 梅州: [116.1, 24.55], 文登: [122.05, 37.2], 上海: [121.48, 31.22], 攀枝花: [101.718637, 26.582347], 威海: [122.1, 37.5], 承德: [117.93, 40.97], 厦门: [118.1, 24.46], 汕尾: [115.375279, 22.786211], 潮州: [116.63, 23.68], 丹东: [124.37, 40.13], 太仓: [121.1, 31.45], 曲靖: [103.79, 25.51], 烟台: [121.39, 37.52], 福州: [119.3, 26.08], 瓦房店: [121.979603, 39.627114], 即墨: [120.45, 36.38], 抚顺: [123.97, 41.97], 玉溪: [102.52, 24.35], 张家口: [114.87, 40.82], 阳泉: [113.57, 37.85], 莱州: [119.942327, 37.177017], 湖州: [120.1, 30.86], 汕头: [116.69, 23.39], 昆山: [120.95, 31.39], 宁波: [121.56, 29.86], 湛江: [110.359377, 21.270708], 揭阳: [116.35, 23.55], 荣成: [122.41, 37.16], 连云港: [119.16, 34.59], 葫芦岛: [120.836932, 40.711052], 常熟: [120.74, 31.64], 东莞: [113.75, 23.04], 河源: [114.68, 23.73], 淮安: [119.15, 33.5], 泰州: [119.9, 32.49], 南宁: [108.33, 22.84], 营口: [122.18, 40.65], 惠州: [114.4, 23.09], 江阴: [120.26, 31.91], 蓬莱: [120.75, 37.8], 韶关: [113.62, 24.84], 嘉峪关: [98.289152, 39.77313], 广州: [113.23, 23.16], 延安: [109.47, 36.6], 太原: [112.53, 37.87], 清远: [113.01, 23.7], 中山: [113.38, 22.52], 昆明: [102.73, 25.04], 寿光: [118.73, 36.86], 海南: [118.73, 36.86], }; var convertData = function (data) { var res = []; for (var i = 0; i < data.length; i++) { var geoCoord = geoCoordMap[data[i].name]; if (geoCoord) { res.push({ name: data[i].name, value: geoCoord.concat(data[i].value), }); } } console.log(res); return res; }; option = { tooltip: { show: true, }, visualMap: { show: true, min: 0, max: 200, left: 'left', bottom: '8%', text: ['高', '低'], // 文本,默认为数值文本 // calculable: true, // seriesIndex: [1], showLabel: true, pieces: [ { gt: 200, label: '> 200 亿千瓦时', color: '#5B5A86', }, { gt: 100, lte: 200, label: '100 - 200 亿千瓦时', color: '#B9D6B5', }, { gt: 10, lte: 100, label: '10 - 100 亿千瓦时', color: '#CBD0D3', }, { gt: 0, lte: 10, label: '≤10 亿千瓦时', color: '#EDEAD3', }, ], // inRange: { // color: ['#EDEAD3', '#5B5A86'] // 蓝绿 // } }, geo3D: { map: 'china', roam: true, regionHeight: 0, //shading: 'lambert', // light: { //光照阴影 // main: { // color: '#fff', //光照颜色 // intensity: 1.2, //光照强度 // //shadowQuality: 'high', //阴影亮度 // shadow: true, //是否显示阴影 // alpha:55, // beta:10 // }, // ambient: { // intensity: 0.3 // } // } }, series: [ //柱状图 { name: '发电量', type: 'bar3D', coordinateSystem: 'geo3D', barSize: 0.5, //柱子粗细 shading: 'lambert', opacity: 1, bevelSize: 0.2, label: { show: false, formatter: '{b}', }, data: [{ name: '黑龙江', value: [125.03, 46.58, 156] }], }, { type: 'map3D', map: 'china', itemStyle: { areaColor: '#374151',// 地图配色 // areaColor: 'rgba(10, 133, 171, 0.8)', opacity: 1, borderWidth: 0.4, borderColor: '#00FFF8', // 地图边配色 }, data: dataMaps, }, ], };