Leaflet.js：在页面加载时打开所有弹出窗口

我试图从Leaflet.js文档中找到如何在显示页面时打开多个弹出窗口。例如，如果有三个标记（每个标记代表一栋建筑物），则每个标记都会立即打开其弹出窗口。Leaflet.js：在页面加载时打开所有弹出窗口

http://leaflet.cloudmade.com/reference.html#popup

含糊地说：

“使用地图＃openPopup打开弹出式窗口，同时确保只有一个弹出窗口开启一次（推荐可用性），或使用地图＃addLayer为打开许多你想要的。“

但

http://leaflet.cloudmade.com/reference.html#map-addlayer

没有给出关于如何可能实现的提示。

任何人都可以澄清，如果这是可能的，并给出如何做到这一点的提示？

来源

2012-01-28 fooquency

您必须将弹出窗口添加为图层。尝试使用此代码示例：

var popupLocation1 = new L.LatLng(51.5, -0.09); 
var popupLocation2 = new L.LatLng(51.51, -0.08); 

var popupContent1 = '<p>Hello world!<br />This is a nice popup.</p>', 
popup1 = new L.Popup(); 

popup1.setLatLng(popupLocation1); 
popup1.setContent(popupContent1); 

var popupContent2 = '<p>Hello world!<br />This is a nice popup.</p>', 
popup2 = new L.Popup(); 

popup2.setLatLng(popupLocation2); 
popup2.setContent(popupContent2); 

map.addLayer(popup1).addLayer(popup2);

来源

2012-01-29 11:59:02 aborruso

卓越 - 我真的很感激这个例子。我是否认为没有办法在那里既有图标又有弹出窗口？ – fooquency 2012-01-29 23:09:41

嗨，我不知道。尝试张贴在新的官方宣传小组：https://groups.google.com/forum/#!forum/leaflet-js – aborruso 2012-01-31 20:32:03

下面使用类扩展的答案是一个更好的方法，应该是接受的答案 – masterchief 2014-05-19 21:06:27

L.Map = L.Map.extend({ 
    openPopup: function(popup) { 
     // this.closePopup(); 
     this._popup = popup; 
     return this.addLayer(popup).fire('popupopen', { 
      popup: this._popup 
     }); 
    } 
});

例如：http://jsfiddle.net/paulovieira/yVLJf/

在这里找到：https://groups.google.com/forum/#!msg/leaflet-js/qXVBcD3juL4/4pZXHTv1baIJ

来源

2013-05-23 07:22:57 gies0r

你能解释一下这段代码的实现吗？非常感谢，如果你能解释它。 – 2013-05-23 07:42:09

我编辑了我的答案。从创建者：“你可以”L.Class.Extend“默认的L.Map类，定义一个新的openPopup方法。这个新方法将是一个简单的复制粘贴默认的，除了当前弹出的部分已关闭（只是评论该行）“。 – gies0r 2013-05-23 08:49:21

非常感谢@ gies0r，这段代码像一个魅力一样工作 – Kartik 2013-08-04 21:19:34

-1

triky的解决办法是消除对开放地图对象弹出链接：

map.on('popupopen', function (e) { 
    delete map._popup; 
});

来源

2014-05-14 13:33:02 IvanM

这将如何影响切换/关闭未来的弹出窗口？ – Ethereal 2014-05-30 17:12:23

在最新版本中，有一个utoClose选项。

兼得标记，并在弹出同一时间打开，但没有明确加层：

var popup1 = new L.Popup({'autoClose':false}); 
popup1.setLatLng([53.55375, 9.96871]); 
popup1.setContent('First popup'); 

var popup2 = new L.Popup({'autoClose':false}); 
popup2.setLatLng([53.552046, 9.9132]); 
popup2.setContent('Second popup'); 

L.marker([53.55375, 9.96871]).addTo(myMap) 
    .bindPopup(popup1).openPopup(); 

L.marker([53.552046, 9.9132]).addTo(myMap) 
    .bindPopup(popup2).openPopup();

来源

2016-09-09 13:12:29

marker.addTo(myMap).bindPopup('Hello popup', {autoClose:false}).openPopup();

使用自动关闭选项

来源

2016-10-25 14:21:09 thinhnk

Leaflet.js：在页面加载时打开所有弹出窗口

回答

相关问题