欢迎您访问 最编程 本站为您分享编程语言代码,编程技术文章!
您现在的位置是: 首页

vue 实现地图应用程序的开发(使用 Gaode map JS API)

最编程 2024-03-28 18:02:00
...
1 <template> 2 <div 3 id="mapChart" 4 ref="mapChart" 5 style="position: absolute; width: 100%; height: 100%" 6 ></div> 7 </template> 8 9 <script> 10 export default { 11 name: "OpsMarket", 12 data() { 13 return { 14 map: null, 15 mass: null, 16 style: [ 17 "//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png", // 标记样式图片1 18 "//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-red.png", // 标记样式图片2 19 ], 20 list: [ 21 { 22 citycode: "010", 23 adcode: "110000", 24 name: "北京市", 25 center: [116.407394, 39.904211], 26 }, 27 { 28 citycode: "023", 29 adcode: "500000", 30 name: "重庆市", 31 center: [106.551643, 29.562849], 32 }, 33 { 34 citycode: "1853", 35 adcode: "820000", 36 name: "澳门特别行政区", 37 center: [113.543028, 22.186835], 38 }, 39 { 40 adcode: "440000", 41 name: "广东省", 42 center: [113.26641, 23.132324], 43 }, 44 { 45 adcode: "350000", 46 name: "福建省", 47 center: [119.295143, 26.100779], 48 }, 49 { 50 adcode: "460000", 51 name: "海南省", 52 center: [110.349228, 20.017377], 53 }, 54 { 55 adcode: "140000", 56 name: "山西省", 57 center: [112.562678, 37.873499], 58 }, 59 { 60 citycode: "1886", 61 adcode: "710000", 62 name: "*省", 63 center: [121.509062, 25.044332], 64 }, 65 { 66 adcode: "520000", 67 name: "贵州省", 68 center: [106.70546, 26.600055], 69 }, 70 { 71 adcode: "450000", 72 name: "广西壮族自治区", 73 center: [108.327546, 22.815478], 74 }, 75 { 76 adcode: "620000", 77 name: "甘肃省", 78 center: [103.826447, 36.05956], 79 }, 80 { 81 adcode: "410000", 82 name: "河南省", 83 center: [113.753394, 34.765869], 84 }, 85 { 86 adcode: "130000", 87 name: "河北省", 88 center: [114.530235, 38.037433], 89 }, 90 { 91 adcode: "340000", 92 name: "安徽省", 93 center: [117.329949, 31.733806], 94 }, 95 { 96 adcode: "430000", 97 name: "湖南省", 98 center: [112.9836, 28.112743], 99 }, 100 { 101 citycode: "021", 102 adcode: "310000", 103 name: "上海市", 104 center: [121.473662, 31.230372], 105 }, 106 { 107 adcode: "420000", 108 name: "湖北省", 109 center: [114.341745, 30.546557], 110 }, 111 { 112 adcode: "230000", 113 name: "黑龙江省", 114 center: [126.661665, 45.742366], 115 }, 116 { 117 adcode: "150000", 118 name: "内蒙古自治区", 119 center: [111.76629, 40.81739], 120 }, 121 { 122 adcode: "640000", 123 name: "宁夏回族自治区", 124 center: [106.259126, 38.472641], 125 }, 126 { 127 adcode: "360000", 128 name: "江西省", 129 center: [115.81635, 28.63666], 130 }, 131 { 132 adcode: "320000", 133 name: "江苏省", 134 center: [118.762765, 32.060875], 135 }, 136 { 137 adcode: "220000", 138 name: "吉林省", 139 center: [125.32568, 43.897016], 140 }, 141 { 142 adcode: "210000", 143 name: "辽宁省", 144 center: [123.431382, 41.836175], 145 }, 146 { 147 adcode: "370000", 148 name: "山东省", 149 center: [117.019915, 36.671156], 150 }, 151 { 152 adcode: "650000", 153 name: "**自治区", 154 center: [87.627704, 43.793026], 155 }, 156 { 157 citycode: "022", 158 adcode: "120000", 159 name: "天津市", 160 center: [117.200983, 39.084158], 161 }, 162 { 163 adcode: "630000", 164 name: "青海省", 165 center: [101.780268, 36.620939], 166 }, 167 { 168 adcode: "610000", 169 name: "陕西省", 170 center: [108.954347, 34.265502], 171 }, 172 { 173 adcode: "540000", 174 name: "*自治区", 175 center: [91.117525, 29.647535], 176 }, 177 { 178 adcode: "510000", 179 name: "四川省"

上一篇: 教程] 利用 ECharts 实现高德地图的数据可视化使用 ECharts 对高德地图进行数据可视化

下一篇: 网站开发如何使用高德地图 API(三)点击热点打开信息表单