首页 > 解决方案 > 基于点击事件的传单多个弹出窗口

问题描述

我正在尝试通过单击折线来打开多个 (5) 弹出窗口。看来我只能使用 clickevent 打开其中一个弹出窗口/照片。是否可以通过单击 Leaflet 中的折线打开 5 个弹出窗口?

function getPhotos(res) {
  const photo_link = `https://www.strava.com/api/v3/activities/number/photos?photo_sources=true&access_token=hidden&size=1000`;
  fetch(photo_link)
    .then((res) => res.json())
    .then(function (data) {
      for (var x = 0; x < data.length; x++) {
        var images = data[x].urls["1000"];
        console.log(images);
        var lat = data[x].location[0];
        var lng = data[x].location[1];
        var latlng = { lat, lng };
        console.log(latlng);
        L.polyline(coordinates, {
          color: "red",
          weight: 3,
        })
          .on("click", function (e) {
            L.popup({ autoPan: false })
              .setContent("<img src='" + images + "' width='160'/>")
              .setLatLng(latlng)
              .openOn(map);
          })

          .addTo(map);
      }
    });
}
getPhotos();

标签: javascriptleaflet

解决方案


var layer= new L.popup({ autoPan: false, autoClose: false })

                                .setContent("<img src='" + images + "' width='160'/>")
                                .setLatLng(latlng)
                            map.addLayer(layer)


推荐阅读