点标记实例2： 地图渲染出多个标记点和其文本标注

//动态获取的数据 res
res.forEach(item) => {

  var marker = new AMap.Marker({
      icon: "http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
      position: new AMap.LngLat(item.longitude,item.latitude),
      label: {
          offset: new AMap.Pixel(-10, -40),  //设置文本标注偏移量
          content: `<div class="mymarkerLabel"><span style="margin-right:10px;">${item.label}</span><img src="https://webapi.amap.com/images/close2.gif" alt=""><img src="static/img/sharp.png" style="width: 20px;height: 20px;margin: 0 auto;position: absolute;bottom: -20px;left: 0;"/></div>`, //设置文本标注内容
          direction: 'right' //设置文本标注方位
      },
      title: item.label,
  });

  marker.setMap(_this.map);
});

//css
<style>
  .mymarkerLabel {
    position: relative;
    background: #fff;
    line-height: 30px;
    padding: 0 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
  }
  .amap-marker-label{
    border: 0;
    background-color: transparent;
  }
</style>