vue引入高德地图，点标记是张图片，鼠标滑过提示文字，点击跳转（sos救命）

需求：1.引入高德地图，需要点标记是张图片，鼠标滑过提示文字，点击跳转（算是实现了，路还很长还有其他需求，求大佬指点，指导一下少掉两根头发）

vue中引入可以直接用高德的api 或 组件vue-amap

vue-amap

由于官网没有代码示例，很不方便，附上转载有代码示例的
https://docs.guyixi.cn/vue-amap/#/zh-cn/introduction/install

安装 npm install @vuemap/vue-amap --save

引入。。算了官网有 自行研究吧

感觉灵活点标记可以实现我的需求--然而 地图搜小到一定比例后会不展示图标，鼠标滑过的文字放在title里面的话 好像没办法改样式 （求大佬指点！！）--然后就需要去高德看api，so放弃了使用vue-amap

<el-amap  :zoom="zoom" :center="center" class="amap-demo">
        <el-amap-elastic-marker :position="componentMarker.position" title="标号" :visible="componentMarker.visible" :draggable="componentMarker.draggable" :zoom-style-mapping="componentMarker.zoomStyleMapping" :styles="componentMarker.styles" @init="markerInit" @click="clickMarker">
        </el-amap-elastic-marker>
</el-amap>

不使用插件实现

<div id="container"></div>

 data() {
    return {
      map : '',
      lnglats: [
        [116.968904, 39.999923],
        [116.382122, 39.921176],
        [116.372122, 39.921176],
        [116.968904, 39.900001],
        [117.418258, 39.914600]
    ]
    }
  },
  mounted (){
    this.mapInit()
  },
  methods :{
    mapInit(){
      const that = this
      // 实例化地图
      this.map = new AMap.Map('container', {
        resizeEnable: true,
        zoom:18,
        center: [116.397428, 39.90923]
      })
      // 定制展示marker的content
      var infoWindow = new AMap.InfoWindow({offset: new AMap.Pixel(0, -30)});
      for (var i = 0; i<that.lnglats.length; i++){
            // 加载点标记
        let marker = new AMap.Marker({
          position: this.lnglats[i],
          offset: new AMap.Pixel(-12,-12),
          icon : new AMap.Icon({
            image: 'https://vdata.amap.com/icons/b18/1/2.png',
            size: new AMap.Size(24, 24),
          }),
          map:that.map
        })
        marker.content  = '<div>我是第个'+ (i + 1)+'</div>';
        marker.content  += '<div>经度：' +this.lnglats[i][0] + '</div>';
        // 鼠标移入
        marker.on('mouseover', function(e) {
          console.log('66666',e.target.content)
          infoWindow.setContent(e.target.content);
          infoWindow.open(that.map, e.target.getPosition());
        })
        // 鼠标移出
        marker.on('mouseout',function(e){
          infoWindow.close(that.map, e.target.getPosition());
        })
      }
    },
  },