LeafletJS標記在變焦上移動

使用LeafletJS這是ace，直到現在：P我們沒有JSON對象或任何東西，所以我將這些值從HTML（標題，latlng）中取出並創建標記。通常情況下，這種方法可行，但是在繪製它們時存在一個問題。當地圖真的放大時，它們看起來沒問題，但是當你縮小（比如最初的地圖）時，它們就會離開。然後他們繼續放大。LeafletJS標記在變焦上移動

那麼，我做錯了什麼？

http://jsbin.com/edegox/1 http://jsbin.com/edegox/1/edit

乾杯湯姆

來源

2013-07-26 Leads

-2

好了，這是與IconSize，iconSize，iconAnchor，shadowAnchor和popupAnchor設置執行。整理出來，這一切都很好:)

感謝@helloimtom爲:)

來源

2013-07-26 10:35:38 Leads

你能否提供更多細節要點的例子 - 我有一個自定義標記相同的問題，但用Photoshop檢查大小和不能看到明顯的問題。 – olive

能否請您發佈問題的確切解決方案？ – autonomy

你可以發佈你的解決方案嗎？ – tmthyjames

這個問題的解決是很簡單的。潛在客戶應該發佈它。

當您的標記在地圖上移動時，這是因爲地圖不知道標記的大小和/或它不知道標記位置的標記點。

您的標記圖標的代碼可能是這樣的：

var locationIcon = L.icon({iconUrl:'location_marker_icon.png'});

現在，讓我們假設你的形象是24像素寬和36px高。爲了使您的標記從走動，你只需指定標記的大小，和「錨點」 ...

var locationIcon = L.icon({ 
          iconUrl:'location_marker_icon.png', 
          iconSize: [24,36], 
          iconAnchor: [12,36] 
          });

這會使底部的中心像素代表的確切緯度/經度點你指定標記，並將它保持在那裏！

來源

2015-04-30 20:23:58 Jaimz

由於看起來像這樣的圖標，用98px寬的整體尺寸由114px身高：

iconSize將[98, 114]。這是圖標的整體大小。
您的iconAnchor將是[49, 114]。（即98 ÷ 2 = 49）

如果你想使用這個圖標例如，您的最終代碼看起來應該是這樣的圖標錨第一個數字可以通過採取第一個數字在iconSize和除以2來計算：

var locationIcon = L.icon({ 
    iconUrl:'location_marker_icon.png', 
    iconSize: [98, 114], 
    iconAnchor: [49, 114] 
});

以下是你可以測試（我強調有問題的行）https://gist.github.com/anonymous/fe19008c911e1e6b6490#file-index-html-L38-L44

來源

2015-08-22 15:50:43

LeafletJS標記在變焦上移動

回答

相關問題