高德地图 搜索以后 多个marker绑定点击事件 自定义窗口内容
<script
  type="text/javascript"
  src="http://webapi.amap.com/maps?v=1.3&key=你自己的key&plugin=AMap.Geocoder,AMap.Autocomplete,AMap.PlaceSearch"
></script>
<div id="container"></div>
<div id="myPageTop">
  <table>
    <tr>
      <td>
        <label>请输入关键字:</label>
      </td>
    </tr>
    <tr>
      <td>
        <input id="tipinput" />
      </td>
    </tr>
  </table>
</div>
<div id="tip">
  <span id="result"></span>
</div>
<script type="text/javascript">
  
  map = new AMap.Map("container", {
    resizeEnable: true,
    center: [116.403851, 39.915177],
    zoom: 13,
  });
  
  var autoOptions = {
    input: "tipinput",
  };
  var auto = new AMap.Autocomplete(autoOptions);
  var placeSearch = new AMap.PlaceSearch({
    map: "",
  }); 
  AMap.event.addListener(auto, "select", select); 
  var infoWindow = new AMap.InfoWindow({ offset: new AMap.Pixel(0, -30) });
  function select(e) {
    placeSearch.setCity(e.poi.adcode);
    if (e.poi && e.poi.location) {
      map.setZoom(15);
      map.setCenter(e.poi.location);
    }
    placeSearch.search(e.poi.name, function (status, result) {
      if (status === "complete" && result.info === "OK") {
        for (var h = 0; h < result.poiList.pois.length; h++) {
          
          var jy = result.poiList.pois[h]["location"]; 
          var address = result.poiList.pois[h]["address"]; 
          var marker = new AMap.Marker({
            
            map: map,
            position: jy,
          });
          marker.extData = {
            getLng: jy["lng"],
            getLat: jy["lat"],
            address: address,
          }; 
          marker.content = "123123123";
          marker.on("click", function (e) {
            var hs = e.target.extData;
            infoWindow.setContent(hs["address"]); 
            infoWindow.open(map, e.target.getPosition());
            console.log(hs);
          });
          marker.emit("click", { target: marker });
        }
        
        
      }
    }); 
    
  }
  
  marker = new AMap.Marker({
    
    map: map,
    position: [116.403851, 39.915177],
  });
  map.on("click", function (e) {
    if (marker) {
      marker.setMap(null);
      marker = null;
    }
    getLng = e.lnglat.getLng();
    getLat = e.lnglat.getLat();
    lnglatXY = [e.lnglat.getLng(), e.lnglat.getLat()]; 
    var geocoder = new AMap.Geocoder({
      radius: 1000,
      extensions: "all",
    });
    geocoder.getAddress(lnglatXY, function (status, result) {
      if (status === "complete" && result.info === "OK") {
        
        address = result.regeocode.formattedAddress;
        
        alert(
          "您在[ " + result.regeocode.formattedAddress + " ]的位置点击了地图!"
        );
      }
    });
    marker = new AMap.Marker({
      
      map: map,
      position: lnglatXY,
    });
    map.setFitView();
  });
</script>
         
        
            
                作者
                
                
                    xiaoyierle
                
                发表于
                2020-11-28 20:55:48
                
                
                ,最后修改于
                2020-11-28 20:56:37
            
            
         
    
Comments