在省市兩級版本基礎上增加經緯度數據的新版本。（原經緯度鏈接：https://blog.csdn.net/abcmaopao/article/details/79554904）

注意：賦值時，要注意數值類型（尤其為后臺返回參數中）。要求number類型，賦值string，會引起地圖構建問題，如：只有背景色、不顯示地圖上圓點的值等等）

//import map from "./pubAnalyze.js";//如提取出單獨文件，需要引入，不提取則可忽略此處 let articleSpread = this.$echarts.init(document.getElementById("district")); //初始化地圖 articleSpread.showLoading(this.maskPar); //地圖loading中 //axios異步請求地圖數據,par 為借口參數 getMapInfo(this.par).then(res => {if (res.data.code == 200) {map.mapOption.visualMap.min = resp.regionDataMin * 1; //最大值（如未提取下段代碼到單獨文件中，可忽略此處，直接在當前配置中賦值即可）map.mapOption.visualMap.max = resp.regionDataMax * 1; //最小值（同上）map.mapOption.series.data = map.convertData(res.data.regionList); //返回值（同上），格式為[{name:'北京',value:65757},{name:'上海',value:23563}....]//此段代碼可提取到單獨文件中，然后在需要頁面引入（mapOptions.js文件) --------------const geoCoordMap = {北京: [116.3809433, 39.9236145],天津: [117.2034988, 39.13111877],河北: [114.4897766, 38.04512787],石家莊市: [114.4897766, 38.04512787],唐山市: [118.2017288, 39.62533951],秦皇島市: [119.5982971, 39.92430878],邯鄲市: [114.4729538, 36.60151672],邢臺市: [114.4950867, 37.06558991],保定市: [115.5001831, 38.85707092],張家口市: [114.8787766, 40.81744003],承德市: [117.9223404, 40.96760178],滄州市: [116.8607712, 38.30884171],廊坊市: [116.6898575, 39.51511002],衡水市: [115.7081909, 37.72782135],山西: [112.5693512, 37.87111282],太原市: [112.5693512, 37.87111282],大同市: [113.2963333, 40.0971489],陽泉市: [113.5742569, 37.86065674],長治市: [113.1055679, 36.18191147],晉城市: [112.84272, 35.50651169],朔州市: [112.4232712, 39.31313324],晉中市: [112.7453613, 37.67613983],運城市: [110.9911499, 35.01391602],忻州市: [112.7315521, 38.39920807],臨汾市: [111.5141678, 36.08282471],呂梁市: [111.1348114, 37.512043],內蒙古: [111.6632996, 40.82094193],呼和浩特市: [111.6632996, 40.82094193],包頭市: [109.8517075, 40.6664238],烏海市: [106.8148727, 39.67420197],赤峰市: [118.9498215, 42.26798248],通遼市: [122.2603302, 43.61156082],鄂爾多斯市: [109.7808671, 39.60844559],呼倫貝爾市: [119.7305603, 49.21152878],巴彥淖爾市: [107.3945694, 40.76234055],烏蘭察布市: [113.0985184, 41.03116608],興安盟: [122.0381598, 46.08207144],錫林郭勒盟: [116.0477155, 43.9331762],阿拉善盟: [105.7289837, 38.8515317],遼寧: [123.4116821, 41.7966156],沈陽市: [123.4116821, 41.7966156],大連市: [121.6008377, 38.91780472],鞍山市: [122.9843826, 41.11525726],撫順市: [123.9295578, 41.84786606],本溪市: [123.7645035, 41.28758621],丹東市: [124.3814621, 40.13518143],錦州市: [121.1333695, 41.11112595],營口市: [122.2241516, 40.66835022],阜新市: [121.6488037, 42.00795364],遼陽市: [123.1617432, 41.26513672],盤錦市: [122.0476303, 41.18847656],鐵嶺市: [123.844429, 42.29558182],朝陽市: [120.4514694, 41.57785797],葫蘆島市: [120.8474808, 40.75334168],吉林: [125.3154297, 43.89256287],長春市: [125.3154297, 43.89256287],吉林市: [126.5668182, 43.88667679],四平市: [124.377449, 43.16560745],遼源市: [125.1372833, 42.90859222],通化市: [125.9231262, 41.7232933],白山市: [126.421608, 41.93033218],松原市: [124.82204, 45.172604],白城市: [122.8395767, 45.61641693],延邊朝鮮族自治州: [129.5091262, 42.89120266],黑龍江: [126.6433411, 45.74149323],哈爾濱市: [126.6433411, 45.74149323],齊齊哈爾市: [123.9592667, 47.34136963],雞西市: [130.9477539, 45.2970047],鶴崗市: [130.2761993, 47.33728409],雙鴨山市: [131.1521607, 46.6376915],大慶市: [125.0248566, 46.59545136],伊春市: [128.9043121, 47.72364426],佳木斯市: [130.36232, 46.81366348],七臺河市: [130.8753967, 45.80927277],牡丹江市: [129.5984955, 44.58392334],黑河市: [127.4869385, 50.24448776],綏化市: [126.98349, 46.63701248],大興安嶺地區: [124.5921351, 51.9239847],上海: [121.4692688, 31.23817635],江蘇: [118.7727814, 32.04761505],南京市: [118.7727814, 32.04761505],無錫市: [120.2991333, 31.57723045],徐州市: [117.1856079, 34.26752853],常州市: [119.9502869, 31.78393364],蘇州市: [120.6187286, 31.31645203],南通市: [120.8555679, 32.01506805],連云港市: [119.1668015, 34.60517883],淮安市: [119.14111, 33.502789],鹽城市: [120.1351776, 33.38982773],揚州市: [119.4368362, 32.39188767],鎮江市: [119.4442978, 32.20589829],泰州市: [119.91124, 32.495872],宿遷市: [118.29706, 33.958302],浙江: [120.1592484, 30.26599503],杭州市: [120.1592484, 30.26599503],寧波市: [121.5412827, 29.87066841],溫州市: [120.6502914, 28.01647568],嘉興市: [120.7536316, 30.77111435],湖州市: [120.0971298, 30.86603928],紹興市: [120.5739288, 30.01093102],金華市: [119.6522064, 29.11081696],衢州市: [118.8691788, 28.9584446],舟山市: [122.1016083, 30.02004242],臺州市: [121.4205629, 28.6561185],臨海市: [121.1184464, 28.84889221],麗水市: [119.9165573, 28.44883728],安徽: [117.2757034, 31.86325455],合肥市: [117.2757034, 31.86325455],蕪湖市: [118.3598328, 31.33449554],蚌埠市: [117.3613815, 32.93924332],淮南市: [117.0207291, 32.6166954],馬鞍山市: [118.4807129, 31.72492409],淮北市: [116.7874985, 33.9704895],銅陵市: [117.813179, 30.92524719],安慶市: [117.0344315, 30.51264572],黃山市: [118.3090668, 29.72084427],滁州市: [118.3011627, 32.31653214],阜陽市: [115.8097305, 32.90220642],宿州市: [116.9701538, 33.6401329],六安市: [116.4927902, 31.75352287],亳州市: [115.7709, 33.879292],池州市: [117.4773331, 30.65686607],宣城市: [118.7586551, 30.94078918],福建: [119.2978134, 26.07859039],福州市: [119.2978134, 26.07859039],廈門市: [118.0875168, 24.45743561],莆田市: [119.0103226, 25.43813705],三明市: [117.6012268, 26.22301292],泉州市: [118.5896378, 24.91591835],漳州市: [117.6530914, 24.51816368],南平市: [118.1691208, 26.64484215],龍巖市: [117.0303879, 25.10970306],寧德市: [119.5183182, 26.6664772],江西: [115.8999176, 28.67599106],南昌市: [115.8999176, 28.67599106],景德鎮市: [117.1179428, 29.19516754],萍鄉市: [113.841423, 27.63298988],九江市: [115.984581, 29.72321129],新余市: [114.9293823, 27.80654717],鷹潭市: [117.0302811, 28.2455864],贛州市: [114.9336777, 25.85288239],吉安市: [114.9704285, 27.1062088],宜春市: [114.3746109, 27.79557419],撫州市: [116.3010483, 27.93483162],上饒市: [117.9634018, 28.45326614],山東: [117.0056, 36.6670723],濟南市: [117.0056, 36.6670723],青島市: [120.3581696, 36.13386154],淄博市: [118.0560532, 36.7935791],棗莊市: [117.556282, 34.87264633],東營市: [118.4959564, 37.46191406],煙臺市: [121.3799362, 37.53561401],濰坊市: [119.1068497, 36.7040863],濟寧市: [116.576561, 35.40924072],泰安市: [117.1241074, 36.1871109],威海市: [122.1116867, 37.50076294],日照市: [119.4515533, 35.42756271],萊蕪市: [117.66173, 36.205116],臨沂市: [118.3379593, 35.06945038],德州市: [116.2878723, 37.45369339],聊城市: [115.9884262, 36.44943237],濱州市: [118.0217667, 37.36781311],菏澤市: [115.4457626, 35.24853897],河南: [113.6500473, 34.7570343],鄭州市: [113.6500473, 34.7570343],開封市: [114.3461685, 34.7851944],洛陽市: [112.4247971, 34.66804123],平頂山市: [113.3001938, 33.74362946],安陽市: [114.3500519, 36.09685135],鶴壁市: [114.1546707, 35.94008255],新鄉市: [113.8685532, 35.30746841],焦作市: [113.2217865, 35.24735642],濮陽市: [115.0149536, 35.70189667],許昌市: [113.8215866, 34.02685928],漯河市: [114.0410919, 33.57250977],三門峽市: [111.1952591, 34.78076935],南陽市: [112.5375137, 32.99901962],商丘市: [115.6471863, 34.44358444],信陽市: [114.0677185, 32.13063049],周口市: [114.6372528, 33.62804031],駐馬店市: [114.0356903, 32.97904205],濟源市: [112.6027201, 35.06706997],湖北: [114.2919388, 30.56751442],武漢市: [114.2919388, 30.56751442],黃石市: [115.0749893, 30.21379852],十堰市: [110.7827988, 32.65213013],宜昌市: [111.2852707, 30.70395279],襄陽市: [112.1411133, 32.04539871],鄂州市: [114.8811874, 30.40276718],荊門市: [112.2002106, 31.03021622],孝感市: [113.9113312, 30.92845535],荊州市: [112.2477875, 30.31733513],黃岡市: [114.8649292, 30.44901848],咸寧市: [114.2687378, 29.89432716],隨州市: [113.36982, 31.715105],恩施土家族苗族自治州: [109.4881804, 30.27218711],仙桃市: [113.4545113, 30.36252891],潛江市: [112.8993007, 30.40148025],天門市: [113.1661477, 30.66340805],神農架林區: [110.6759643, 31.74451435],湖南: [112.9812698, 28.20082474],長沙市: [112.9812698, 28.20082474],株洲市: [113.1520615, 27.85422325],湘潭市: [112.9150238, 27.87335014],衡陽市: [112.5993576, 26.90055466],邵陽市: [111.4773789, 27.25023651],岳陽市: [113.0980682, 29.37461853],常德市: [111.6876297, 29.03820992],張家界市: [110.4814835, 29.13187981],益陽市: [112.3340683, 28.60197067],郴州市: [113.0286484, 25.80229187],永州市: [111.6121979, 26.2112999],懷化市: [109.9542313, 27.54740715],婁底市: [111.9938965, 27.74133492],湘西土家族苗族自治州: [109.7389287, 28.31173554],廣東: [113.2614288, 23.11891174],廣州市: [113.2614288, 23.11891174],韶關市: [113.6053925, 24.80877686],深圳市: [114.110672, 22.55639648],珠海市: [113.5682602, 22.27258873],汕頭市: [116.6837997, 23.36269188],佛山市: [113.1145172, 23.03487778],江門市: [113.0847473, 22.59119034],湛江市: [110.3992233, 21.19499779],茂名市: [110.8888474, 21.67071724],肇慶市: [112.4514084, 23.05788231],惠州市: [114.3924027, 23.08795738],梅州市: [116.1079407, 24.31450081],汕尾市: [115.3640137, 22.77868652],河源市: [114.6938171, 23.73484039],陽江市: [111.9578934, 21.84523392],清遠市: [113.0212631, 23.71959686],東莞市: [113.7487717, 23.0485363],中山市: [113.3714523, 22.52685356],潮州市: [116.63666, 23.667706],揭陽市: [116.34977, 23.542976],云浮市: [112.03999, 22.933193],廣西: [108.3117676, 22.80654335],南寧市: [108.3117676, 22.80654335],柳州市: [109.4028091, 24.31040573],桂林市: [110.2866821, 25.28188324],梧州市: [111.3059464, 23.48661995],北海市: [109.1191711, 21.47979736],防城港市: [108.35658, 21.768936],欽州市: [108.6147003, 21.94986916],貴港市: [109.60844, 23.099092],玉林市: [110.1414719, 22.63189697],百色市: [106.6121063, 23.90158272],賀州市: [111.53455, 24.417259],河池市: [108.0516281, 24.69689179],來賓市: [109.23294, 23.73144],崇左市: [107.35506, 22.420197],海南: [110.3465118, 20.03179359],海口市: [110.3465118, 20.03179359],三亞市: [109.5078201, 18.23404312],三沙市: [112.33356, 16.83272],儋州市: [109.5806849, 19.52092966],五指山市: [109.5169672, 18.77516377],瓊海市: [110.4746526, 19.25839642],文昌市: [110.797742, 19.54330274],萬寧市: [110.3897474, 18.79532292],東方市: [108.6536594, 19.09613826],定安縣: [110.3590789, 19.68133946],屯昌縣: [110.1034735, 19.35182579],澄邁縣: [110.0048522, 19.73847934],臨高縣: [109.690764, 19.91242821],白沙黎族自治縣: [109.4516753, 19.22543478],昌江黎族自治縣: [109.0555816, 19.29827945],樂東黎族自治縣: [109.1736131, 18.7498679],陵水黎族自治縣: [110.0371871, 18.50595483],保亭黎族苗族自治縣: [109.7025825, 18.63904542],瓊中黎族苗族自治縣: [109.8382244, 19.03322394],重慶: [106.5103378, 29.55817604],四川: [104.0817566, 30.66105652],成都市: [104.0817566, 30.66105652],自貢市: [104.7763519, 29.36772156],攀枝花市: [101.6984177, 26.55479813],瀘州市: [105.4378433, 28.88199425],德陽市: [104.3915482, 31.13044548],綿陽市: [104.7485504, 31.45634842],廣元市: [105.8317032, 32.44396973],遂寧市: [105.5697098, 30.50339317],內江市: [105.0534363, 29.57756805],樂山市: [103.7514038, 29.56822395],南充市: [106.0816269, 30.79582214],眉山市: [103.83146, 30.050497],宜賓市: [104.6168671, 28.77025604],廣安市: [106.63175, 30.474428],達州市: [107.5003433, 31.22469711],雅安市: [102.9826965, 29.98229408],巴中市: [106.75476, 31.849014],資陽市: [104.65019, 30.122671],阿壩藏族羌族自治州: [102.2247375, 31.89937935],甘孜藏族自治州: [101.962514, 30.04930605],涼山彝族自治州: [102.2674383, 27.88162244],貴州: [106.7113724, 26.57687378],貴陽市: [106.7113724, 26.57687378],六盤水市: [104.8732529, 26.5767746],遵義市: [106.9293976, 27.69538689],安順市: [105.9260712, 26.24425888],畢節市: [105.2824173, 27.3062954],銅仁市: [109.1926804, 27.72216606],黔西南布依族苗族自治州: [104.9043531, 25.08987278],黔東南苗族侗族自治州: [107.9841392, 26.5836279],黔南布依族苗族自治州: [107.5222592, 26.25427309],云南: [102.704567, 25.04384422],昆明市: [102.704567, 25.04384422],曲靖市: [103.7947006, 25.49616623],玉溪市: [102.5332336, 24.35497284],保山市: [99.16872406, 25.11680222],昭通市: [103.7149277, 27.34227943],麗江市: [100.2342529, 26.87666512],普洱市: [100.9752121, 22.79548073],臨滄市: [100.0878067, 23.8799305],楚雄彝族自治州: [101.5276607, 25.04494301],紅河哈尼族彝族自治州: [103.3755878, 23.36421652],文山壯族苗族自治州: [104.2150486, 23.39868766],西雙版納傣族自治州: [100.7973892, 22.0074942],大理白族自治州: [100.2676255, 25.60646837],德宏傣族景頗族自治州: [98.58484387, 24.4323115],怒江傈僳族自治州: [98.85671501, 25.81753271],迪慶藏族自治州: [99.70302652, 27.81906659],西藏: [91.11445308, 29.64411352],拉薩市: [91.11445308, 29.64411352],日喀則市: [88.88110958, 29.26701395],昌都市: [97.17220509, 31.14069782],林芝市: [94.36153102, 29.64893975],山南市: [91.77308713, 29.23701982],那曲地區: [92.0513207, 31.47611103],阿里地區: [81.14540521, 30.40052298],陜西: [108.949028, 34.26168442],西安市: [108.949028, 34.26168442],銅川市: [109.0572815, 35.07545853],寶雞市: [107.1383591, 34.38228607],咸陽市: [108.7101288, 34.33721542],渭南市: [109.5008392, 34.50152588],延安市: [109.471283, 36.59387207],漢中市: [107.0343933, 33.07814789],榆林市: [109.7574463, 38.29727554],安康市: [109.0257874, 32.68986511],商洛市: [109.9403909, 33.87035105],甘肅: [103.7500534, 36.06803894],蘭州市: [103.7500534, 36.06803894],嘉峪關市: [98.27471161, 39.80265427],金昌市: [102.1657486, 38.49519348],白銀市: [104.1837769, 36.53941727],天水市: [105.7152405, 34.58426666],武威市: [102.633461, 37.9269104],張掖市: [100.4502869, 38.93505859],平涼市: [106.6830673, 35.53551865],酒泉市: [98.51111603, 39.74496841],慶陽市: [107.6362305, 35.73855972],定西市: [104.6185684, 35.57523727],隴南市: [104.92928, 33.39484],臨夏回族自治州: [103.2108906, 35.60121067],甘南藏族自治州: [102.9109863, 34.98324974],青海: [101.7778162, 36.61728828],西寧市: [101.7778162, 36.61728828],海東市: [102.4017109, 36.48207227],海北藏族自治州: [100.9009262, 36.95451784],黃南藏族自治州: [102.0150337, 35.51988388],海南藏族自治州: [100.6203395, 36.28660837],果洛藏族自治州: [100.2447092, 34.47138225],玉樹藏族自治州: [97.00645511, 33.00525219],海西蒙古族藏族自治州: [97.37119774, 37.37707972],寧夏: [106.2719421, 38.46800995],銀川市: [106.2719421, 38.46800995],石嘴山市: [106.3820572, 39.02428055],吳忠市: [106.1991119, 37.98549652],固原市: [106.2785873, 36.01325989],中衛市: [105.18661, 37.513252],新疆: [89.1895474, 42.95130195],烏魯木齊市: [87.60611725, 43.79093933],克拉瑪依市: [84.86360931, 45.59651184],吐魯番市: [89.1895474, 42.95130195],哈密市: [93.51536928, 42.81854115],昌吉回族自治州: [87.30817902, 44.01114114],博爾塔拉蒙古自治州: [82.06674632, 44.90603596],巴音郭楞蒙古自治州: [86.14517515, 41.76404026],阿克蘇地區: [80.2600596, 41.1684029],克孜勒蘇柯爾克孜自治州: [76.16660835, 39.71529724],喀什地區: [75.98973068, 39.47039628],和田地區: [79.92243983, 37.11429217],伊犁哈薩克自治州: [81.32412996, 43.91686827],塔城地區: [82.98043953, 46.74531234],阿勒泰地區: [88.14031038, 47.8456187],石河子市: [86.078911, 44.30652036],阿拉爾市: [81.28064163, 40.54795812],圖木舒克市: [79.06901071, 39.8649427],五家渠市: [87.54014426, 44.16797119],北屯市: [87.80014797, 47.36328619],鐵門關市: [85.67585289, 41.86869689],雙河市: [82.35500262, 44.84417562],可克達拉市: [81.04474154, 43.94797595],昆玉市: [79.29125037, 37.20942446],臺灣: [120.960515, 23.69781],香港: [114.109497, 22.396428],澳門: [113.5440083, 22.20167546]}const convertData = function (data) {var res = [];for (var i = 0; i < data.length; i++) {var geoCoord = geoCoordMap[data[i].name];if (geoCoord) {res.push(geoCoord.concat(data[i].value));}}return res;};let mapOption = {backgroundColor: "#F7F8FA", //canvas 背景色title: {text: "全國主要城市空氣質量",subtext: "data from PM25.in",sublink: "http://www.pm25.in",left: "center",textStyle: {color: "pink"}},tooltip: {trigger: "item"},legend: { // 右下角標注orient: "vertical",top: "bottom",left: "right",data: ["pm2.5"],textStyle: {color: "blue" //鼠標滑過的省份區域的顏色}},visualMap: { //左下角區域色-柱狀區域漸變色min: 0, //最小值max: 300, //最大值// splitNumber: 5, //左下角柱狀區域圖，分為五塊顯示color: ["#0699EA", '#eac736', "#0699EA"], //可添加多個textStyle: {color: "yellowgreen"}},geo: {map: "china",label: {normal: {show: true, // 是否顯示對應地名textStyle: {color: "#a5a5a5" //省份名稱顏色}},emphasis: {show: true}},itemStyle: {normal: {areaColor: "#f3f3f3", //地圖背景色borderColor: "#DCDEE3" //地圖線的顏色},emphasis: {areaColor: "#f3f3f3" //鼠標滑過的省份區域背景色的激活效果（顏色）}}},dataRange: {//省份區域顏色按值大小顯示深淺度，顏色為visual中的值min: 0,max: 2500,x: 'left',y: 'bottom',text:['高','低'], calculable : true},series:// [{name: "pm2.5",type: "scatter",coordinateSystem: "geo",zoom: 1.2, //設置地圖大小：這里是關鍵，一定要放在 series中data: convertData([// { name: "海門", value: 9 },// { name: "合肥", value: 229 },// { name: "武漢", value: 273 },{name: "大慶",value: 279}]),// symbolSize: 12,//圓點的大笑： 可為固定值，或按數值顯示大小（下面寫法）symbolSize: function (val) {return val[2] * 0.01;},label: {normal: {// show: true,// formatter: "{b}"},emphasis: {show: false}},itemStyle: {emphasis: {borderColor: "black",borderWidth: 1}}}// ]}//export default {mapOption,convertData}//提取到單獨文件中，需要添加此處導出。在當前文件中賦值，則忽略此處）// ---------------------------------------- end （ 代碼段范圍 ）---------------------------------------------//articleSpread.setOption(map.mapOption);//繪制地圖(單獨提取出文件繪制）articleSpread.setOption(mapOption); //繪制地圖（當前頁面繪制）articleSpread.hideLoading(); //完成加載之后，取消loading //瀏覽器resize的時候，監聽echarts視圖，重繪echarts大小window.onresize=articleSpread.resize;//只適用于有一張圖標，或者只resize一張echarts圖。多張圖標回覆蓋window 的resize方法，只監聽最后一個。});//多個echarts圖的監聽方法（如下）：可以在mounted中添加監聽事件 // window.addEventListener("resize", () => { // this.countTendency.resize(); // this.ditchEchart.resize(); // });

?

總結

以上是生活随笔為你收集整理的echarts地图，及经纬度(省市两级经纬度)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。