Hooke / map-demo

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
f1aa9ab9 1 parent 96db4386

✨ feat(地图主体部分): 修改地图密钥引入方式

Inline Side-by-side
Showing 7 changed files with 65 additions and 11 deletions
1 <!-- 1 <!--
2 * @Date: 2023-05-31 16:10:33 2 * @Date: 2023-05-31 16:10:33
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2023-07-27 11:08:28 4 + * @LastEditTime: 2025-03-06 10:16:37
5 * @FilePath: /map-demo/index.html 5 * @FilePath: /map-demo/index.html
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
...@@ -26,6 +26,6 @@ ...@@ -26,6 +26,6 @@
26 // serviceHost: 'https://oa-dev.onwall.cn/_AMapService', 26 // serviceHost: 'https://oa-dev.onwall.cn/_AMapService',
27 // } 27 // }
28 </script> 28 </script>
29 - <script src="https://webapi.amap.com/maps?v=2.0&key=381c6763e1fefd810fbab697f470149c&plugin=AMap.ElasticMarker,AMap.ImageLayer,AMap.ToolBar,AMap.IndoorMap"></script> 29 + <!-- <script src="https://webapi.amap.com/maps?v=2.0&key=381c6763e1fefd810fbab697f470149c&plugin=AMap.ElasticMarker,AMap.ImageLayer,AMap.ToolBar,AMap.IndoorMap,AMap.Walking,AMap.Geolocation,AMap.ToolBar"></script> -->
30 </body> 30 </body>
31 </html> 31 </html>
......
...@@ -176,6 +176,7 @@ import Floor from '@/components/Floor' ...@@ -176,6 +176,7 @@ import Floor from '@/components/Floor'
176 import { useRect } from '@vant/use'; 176 import { useRect } from '@vant/use';
177 import { mapAPI } from '@/api/map.js' 177 import { mapAPI } from '@/api/map.js'
178 import wx from 'weixin-js-sdk' 178 import wx from 'weixin-js-sdk'
179 +import AMapLoader from '@amap/amap-jsapi-loader'
179 180
180 const GPS = { 181 const GPS = {
181 PI: 3.14159265358979324, 182 PI: 3.14159265358979324,
...@@ -232,7 +233,10 @@ const GPS = { ...@@ -232,7 +233,10 @@ const GPS = {
232 return ret; 233 return ret;
233 } 234 }
234 }; 235 };
235 - 236 +// 关键安全配置
237 +window._AMapSecurityConfig = {
238 + securityJsCode: '8602057c4c8dae5bed9a240c0582c46f', // 替换为你的密钥
239 +}
236 export default { 240 export default {
237 components: { InfoWindow, InfoWindowLite, InfoWindowWarn, InfoWindowYard, Floor }, 241 components: { InfoWindow, InfoWindowLite, InfoWindowWarn, InfoWindowYard, Floor },
238 data() { 242 data() {
...@@ -324,6 +328,11 @@ export default { ...@@ -324,6 +328,11 @@ export default {
324 } 328 }
325 }, 329 },
326 async mounted() { 330 async mounted() {
331 + const AMap = await AMapLoader.load({
332 + key: '381c6763e1fefd810fbab697f470149c', // 控制台获取
333 + version: '2.0', // 指定API版本
334 + plugins: ['AMap.ElasticMarker','AMap.ImageLayer','AMap.ToolBar','AMap.IndoorMap','AMap.Walking','AMap.Geolocation'] // 必须加载步行导航插件
335 + })
327 const code = this.$route.query.id; 336 const code = this.$route.query.id;
328 const { data } = await mapAPI({i: code}); 337 const { data } = await mapAPI({i: code});
329 // data.list = data.list.concat(map_yard); 338 // data.list = data.list.concat(map_yard);
......
1 <!-- 1 <!--
2 * @Date: 2023-05-19 14:54:27 2 * @Date: 2023-05-19 14:54:27
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-02-10 17:45:25 4 + * @LastEditTime: 2025-03-06 10:28:52
5 * @FilePath: /map-demo/src/views/bieyuan/map.vue 5 * @FilePath: /map-demo/src/views/bieyuan/map.vue
6 * @Description: 公众地图主体页面 6 * @Description: 公众地图主体页面
7 --> 7 -->
...@@ -96,6 +96,7 @@ import audioBackground1 from '@/components/audioBackground1.vue' ...@@ -96,6 +96,7 @@ import audioBackground1 from '@/components/audioBackground1.vue'
96 import { mapState, mapActions } from 'pinia' 96 import { mapState, mapActions } from 'pinia'
97 import { mainStore } from '@/store' 97 import { mainStore } from '@/store'
98 import { parseQueryString } from '@/utils/tools' 98 import { parseQueryString } from '@/utils/tools'
99 +import AMapLoader from '@amap/amap-jsapi-loader'
99 100
100 const GPS = { 101 const GPS = {
101 PI: 3.14159265358979324, 102 PI: 3.14159265358979324,
...@@ -152,7 +153,10 @@ const GPS = { ...@@ -152,7 +153,10 @@ const GPS = {
152 return ret; 153 return ret;
153 } 154 }
154 }; 155 };
155 - 156 +// 关键安全配置
157 +window._AMapSecurityConfig = {
158 + securityJsCode: '8602057c4c8dae5bed9a240c0582c46f', // 替换为你的密钥
159 +}
156 export default { 160 export default {
157 components: { pageInfo, audioBackground1 }, 161 components: { pageInfo, audioBackground1 },
158 data() { 162 data() {
...@@ -268,6 +272,11 @@ export default { ...@@ -268,6 +272,11 @@ export default {
268 } 272 }
269 }, 273 },
270 async mounted() { 274 async mounted() {
275 + const AMap = await AMapLoader.load({
276 + key: '381c6763e1fefd810fbab697f470149c', // 控制台获取
277 + version: '2.0', // 指定API版本
278 + plugins: ['AMap.ElasticMarker','AMap.ImageLayer','AMap.ToolBar','AMap.IndoorMap','AMap.Walking','AMap.Geolocation'] // 必须加载步行导航插件
279 + })
271 const code = this.$route.query.id; 280 const code = this.$route.query.id;
272 const { data } = await mapAPI({ i: code }); 281 const { data } = await mapAPI({ i: code });
273 this.navBarList = data.list; // 底部导航条 282 this.navBarList = data.list; // 底部导航条
......
1 <!-- 1 <!--
2 * @Date: 2023-05-19 14:54:27 2 * @Date: 2023-05-19 14:54:27
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-02-25 16:51:14 4 + * @LastEditTime: 2025-03-06 10:29:04
5 * @FilePath: /map-demo/src/views/index.vue 5 * @FilePath: /map-demo/src/views/index.vue
6 * @Description: 公众地图主体页面 6 * @Description: 公众地图主体页面
7 --> 7 -->
...@@ -124,6 +124,7 @@ import wx from 'weixin-js-sdk' ...@@ -124,6 +124,7 @@ import wx from 'weixin-js-sdk'
124 import InfoPopup from '@/components/InfoPopup' 124 import InfoPopup from '@/components/InfoPopup'
125 import InfoPopupLite from '@/components/InfoPopupLite' 125 import InfoPopupLite from '@/components/InfoPopupLite'
126 import InfoPopupWarn from '@/components/InfoPopupWarn' 126 import InfoPopupWarn from '@/components/InfoPopupWarn'
127 +import AMapLoader from '@amap/amap-jsapi-loader'
127 128
128 const GPS = { 129 const GPS = {
129 PI: 3.14159265358979324, 130 PI: 3.14159265358979324,
...@@ -180,7 +181,10 @@ const GPS = { ...@@ -180,7 +181,10 @@ const GPS = {
180 return ret; 181 return ret;
181 } 182 }
182 }; 183 };
183 - 184 +// 关键安全配置
185 +window._AMapSecurityConfig = {
186 + securityJsCode: '8602057c4c8dae5bed9a240c0582c46f', // 替换为你的密钥
187 +}
184 export default { 188 export default {
185 components: { InfoWindow, InfoWindowLite, InfoWindowWarn, audioBackground, InfoPopup, InfoPopupLite, InfoPopupWarn }, 189 components: { InfoWindow, InfoWindowLite, InfoWindowWarn, audioBackground, InfoPopup, InfoPopupLite, InfoPopupWarn },
186 data() { 190 data() {
...@@ -264,6 +268,11 @@ export default { ...@@ -264,6 +268,11 @@ export default {
264 } 268 }
265 }, 269 },
266 async mounted() { 270 async mounted() {
271 + const AMap = await AMapLoader.load({
272 + key: '381c6763e1fefd810fbab697f470149c', // 控制台获取
273 + version: '2.0', // 指定API版本
274 + plugins: ['AMap.ElasticMarker','AMap.ImageLayer','AMap.ToolBar','AMap.IndoorMap','AMap.Walking','AMap.Geolocation'] // 必须加载步行导航插件
275 + })
267 const code = this.$route.query.id; 276 const code = this.$route.query.id;
268 const { data } = await mapAPI({ i: code }); 277 const { data } = await mapAPI({ i: code });
269 // TAG：预警显示 278 // TAG：预警显示
......
...@@ -143,6 +143,7 @@ import Floor from '@/components/Floor' ...@@ -143,6 +143,7 @@ import Floor from '@/components/Floor'
143 import { useRect } from '@vant/use'; 143 import { useRect } from '@vant/use';
144 import { mapAPI } from '@/api/map.js' 144 import { mapAPI } from '@/api/map.js'
145 import wx from 'weixin-js-sdk' 145 import wx from 'weixin-js-sdk'
146 +import AMapLoader from '@amap/amap-jsapi-loader'
146 147
147 const GPS = { 148 const GPS = {
148 PI: 3.14159265358979324, 149 PI: 3.14159265358979324,
...@@ -199,7 +200,10 @@ const GPS = { ...@@ -199,7 +200,10 @@ const GPS = {
199 return ret; 200 return ret;
200 } 201 }
201 }; 202 };
202 - 203 +// 关键安全配置
204 +window._AMapSecurityConfig = {
205 + securityJsCode: '8602057c4c8dae5bed9a240c0582c46f', // 替换为你的密钥
206 +}
203 export default { 207 export default {
204 components: { InfoWindow, InfoWindowLite, InfoWindowWarn, InfoWindowYard, Floor }, 208 components: { InfoWindow, InfoWindowLite, InfoWindowWarn, InfoWindowYard, Floor },
205 data() { 209 data() {
...@@ -281,6 +285,11 @@ export default { ...@@ -281,6 +285,11 @@ export default {
281 } 285 }
282 }, 286 },
283 async mounted() { 287 async mounted() {
288 + const AMap = await AMapLoader.load({
289 + key: '381c6763e1fefd810fbab697f470149c', // 控制台获取
290 + version: '2.0', // 指定API版本
291 + plugins: ['AMap.ElasticMarker','AMap.ImageLayer','AMap.ToolBar','AMap.IndoorMap','AMap.Walking','AMap.Geolocation'] // 必须加载步行导航插件
292 + })
284 const code = this.$route.query.id; 293 const code = this.$route.query.id;
285 const { data } = await mapAPI({i: code}); 294 const { data } = await mapAPI({i: code});
286 data.list = data.list.concat(map_yard); 295 data.list = data.list.concat(map_yard);
......
1 <!-- 1 <!--
2 * @Date: 2023-05-19 14:54:27 2 * @Date: 2023-05-19 14:54:27
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-02-27 09:32:49 4 + * @LastEditTime: 2025-03-06 10:29:14
5 * @FilePath: /map-demo/src/views/tools.vue 5 * @FilePath: /map-demo/src/views/tools.vue
6 * @Description: 公众地图主体页面 6 * @Description: 公众地图主体页面
7 --> 7 -->
...@@ -126,6 +126,7 @@ import { useRect } from '@vant/use'; ...@@ -126,6 +126,7 @@ import { useRect } from '@vant/use';
126 import { mapAPI } from '@/api/map.js' 126 import { mapAPI } from '@/api/map.js'
127 import wx from 'weixin-js-sdk' 127 import wx from 'weixin-js-sdk'
128 import { showToast } from 'vant'; 128 import { showToast } from 'vant';
129 +import AMapLoader from '@amap/amap-jsapi-loader'
129 130
130 const GPS = { 131 const GPS = {
131 PI: 3.14159265358979324, 132 PI: 3.14159265358979324,
...@@ -182,7 +183,10 @@ const GPS = { ...@@ -182,7 +183,10 @@ const GPS = {
182 return ret; 183 return ret;
183 } 184 }
184 }; 185 };
185 - 186 +// 关键安全配置
187 +window._AMapSecurityConfig = {
188 + securityJsCode: '8602057c4c8dae5bed9a240c0582c46f', // 替换为你的密钥
189 +}
186 export default { 190 export default {
187 components: { InfoWindow, InfoWindowLite, InfoWindowWarn, audioBackground }, 191 components: { InfoWindow, InfoWindowLite, InfoWindowWarn, audioBackground },
188 data() { 192 data() {
...@@ -265,6 +269,11 @@ export default { ...@@ -265,6 +269,11 @@ export default {
265 } 269 }
266 }, 270 },
267 async mounted() { 271 async mounted() {
272 + const AMap = await AMapLoader.load({
273 + key: '381c6763e1fefd810fbab697f470149c', // 控制台获取
274 + version: '2.0', // 指定API版本
275 + plugins: ['AMap.ElasticMarker','AMap.ImageLayer','AMap.ToolBar','AMap.IndoorMap','AMap.Walking','AMap.Geolocation'] // 必须加载步行导航插件
276 + })
268 const code = this.$route.query.id; 277 const code = this.$route.query.id;
269 const { data } = await mapAPI({ i: code }); 278 const { data } = await mapAPI({ i: code });
270 data.list = data.list.concat(map_alert); 279 data.list = data.list.concat(map_alert);
......
...@@ -124,6 +124,7 @@ import wx from 'weixin-js-sdk' ...@@ -124,6 +124,7 @@ import wx from 'weixin-js-sdk'
124 import InfoPopup from '@/components/InfoPopup' 124 import InfoPopup from '@/components/InfoPopup'
125 import InfoPopupLite from '@/components/InfoPopupLite' 125 import InfoPopupLite from '@/components/InfoPopupLite'
126 import InfoPopupWarn from '@/components/InfoPopupWarn' 126 import InfoPopupWarn from '@/components/InfoPopupWarn'
127 +import AMapLoader from '@amap/amap-jsapi-loader'
127 128
128 const GPS = { 129 const GPS = {
129 PI: 3.14159265358979324, 130 PI: 3.14159265358979324,
...@@ -180,7 +181,10 @@ const GPS = { ...@@ -180,7 +181,10 @@ const GPS = {
180 return ret; 181 return ret;
181 } 182 }
182 }; 183 };
183 - 184 +// 关键安全配置
185 +window._AMapSecurityConfig = {
186 + securityJsCode: '8602057c4c8dae5bed9a240c0582c46f', // 替换为你的密钥
187 +}
184 export default { 188 export default {
185 components: { InfoWindow, InfoWindowLite, InfoWindowWarn, audioBackground, InfoPopup, InfoPopupLite, InfoPopupWarn }, 189 components: { InfoWindow, InfoWindowLite, InfoWindowWarn, audioBackground, InfoPopup, InfoPopupLite, InfoPopupWarn },
186 data() { 190 data() {
...@@ -265,6 +269,11 @@ export default { ...@@ -265,6 +269,11 @@ export default {
265 } 269 }
266 }, 270 },
267 async mounted() { 271 async mounted() {
272 + const AMap = await AMapLoader.load({
273 + key: '381c6763e1fefd810fbab697f470149c', // 控制台获取
274 + version: '2.0', // 指定API版本
275 + plugins: ['AMap.ElasticMarker','AMap.ImageLayer','AMap.ToolBar','AMap.IndoorMap','AMap.Walking','AMap.Geolocation'] // 必须加载步行导航插件
276 + })
268 const code = this.$route.query.id; 277 const code = this.$route.query.id;
269 const { data } = await mapAPI({ i: code }); 278 const { data } = await mapAPI({ i: code });
270 // TAG：预警显示 279 // TAG：预警显示
......