Broşür üzerinde ortalanmış olmayan dinamik içerikli yaprakçık açılır penceresi

Question

Dinamik içerikli bir yaprakçık açılır pencere oluşturmaya çalışıyorum, ancak açılır kabarcık, işaretçi ile hizalanmaz.

İşte bir ekran görüntüsü, onun açık olduğunu, kabarcık kabarcık işaretleyici ortalanmış değil. İşte

Ayrıca burada kod

var map = L.map('map').setView([51.505, -0.09], 13); 

L.tileLayer('https://{s}.tiles.mapbox.com/v3/{id}/{z}/{x}/{y}.png', { 
     maxZoom: 18, 
     id: 'examples.map-i875mjb7' 
}).addTo(map); 


m = L.marker([51.5, -0.09]).addTo(map); 
m.bindPopup("<b>Hello world!</b><br />I am a popup<span id='a'></span>", {maxWidth: "none"}) 
m.openPopup(); 

$('#a').html('abcdefghijklmnopqrstuvwxyz') 

olan sorun açıklanır minimal jsfiddle örnektir: Bunu nasıl düzeltebilirim http://jsfiddle.net/nk93shkt/

?

Answer 1

Broşür, oluşturulduğu zaman bilgi kutusunun genişliğini belirliyor gibi görünüyor. Görüntülendikten sonra metin ekliyorsunuz, bu yüzden broşür artık gerçek boyutunu bilmiyor ve bu nedenle düzgün bir şekilde ortalayamıyor.

bu biraz uzun soluklu örnekte documentation den setPopupContent() yöntemi deneyin: pozisyon başlangıçta belirlenen alır

m = L.marker([51.5, -0.09]).addTo(map); 
m.bindPopup("<b>Hello world!</b><br />I am a popup<span></span>", {maxWidth: "none"}) 
m.openPopup(); 
var a = m.getPopup(); 
var b = a._content.replace("<span></span>","<span>asdasdasda</span>"); 
m.setPopupContent(b); 

JSFIDDLE

Answer 2

, el

m.openPopup(); 
adjustPopup('abcdefghijklmnopqrstuvwxyz<br>sdfsdfs<br>sdfsdfsdf'); 
function adjustPopup(html) 
{ 
    $('#a').html(html); 
    var $leaflet=$('#a').closest('div.leaflet-popup'); 
    var width=$leaflet.width(); 
    $leaflet.css({left:"-"+(width/2)+"px"}); 
} 

jQuery

ile ayarlayın böylece

Answer 3

Orijinal cevabın seçilmesinden sonra bunun Leaflet API'sına eklenip eklenmediğinden emin değilim, ancak açılır pencerenin içeriğini değiştirdikten sonra yöntem güncellemesini() kullanın.

http://leafletjs.com/reference.html#popup-update