vue 高德地图设置鼠标样式

最新推荐文章于 2024-05-20 10:44:53 发布

＊且听风吟

最新推荐文章于 2024-05-20 10:44:53 发布

阅读量1.1k

点赞数

分类专栏： # Vue 2.x 文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/HH18700418030/article/details/129684050

版权

高德地图JS API 2.0 设置鼠标样式在线示例

首先，在 index.html 中引入图标：

<link rel="stylesheet" href="https://at.alicdn.com/t/font_873139_0v65kqy674.css" >

封装工具文件 utils/map.js ：

export default function MapLoader () {
   
  return new Promise((resolve, reject) => {
   
    if (window.AMap) {
   
      resolve(window.AMap)
    } else {
   
      // 动态创造DOM，引入api
      const script = document.createElement('script')
      script.type = 'text/javascript'
      script.async = true
      // 如果只需要获取经纬度可以跳过这步，经纬度逆解析为详细地址时需要配置这个
      window._AMapSecurityConfig = {
    securityJsCode: '' }
      script.src = 'http://webapi.amap.com/maps?v=2.0&callback=initAMap&key='
      script.onerror = reject
      document.head.appendChild(script)
    }
    window.initAMap = () => {
   
      resolve(window.AMap)
    }
  })
}