2015-04-02 138 views
0

基本設置是這樣的:MapBox:調用fitBounds()與多個標記不會呈現瓷磚

  1. 實例化集中在一個緯度/經度/變焦
  2. 創建功能與多個標記和圖層的地圖對象添加到地圖
  3. 呼叫map.fitBounds()來調整縮放級別,以容納所述標記

結果:標記渲染,但底層地圖圖塊沒有。

SO上的人們已經報告過此版本的mapbox.js(我正在使用v2.1.6)。以前的解決方案是到:

  1. 在地圖上不叫的setView()的時候本來實例映射對象
  2. 使用超時,以避免出現競爭狀況調用fitBounds()

這些都不時解決方案已經幫助了,但是,我很好奇,如果有其他人面臨類似的問題。我創建了一個演示我有問題一的jsfiddle:希望能解決https://jsfiddle.net/Lgfazueq/

L.mapbox.accessToken = 

'pk.eyJ1IjoiZHJpemx5IiwiYSI6IkhMLXBmVGcifQ.CFEPrONMLQQJdiJ2NV9Qsg'; 
var map = L.mapbox.map('map', 'examples.map-i86nkdio').setView([40.7377, -73.9801], 12); 
//var map = L.mapbox.map('map', 'examples.map-i86nkdio'); 

geoJSON = { 
    type: 'FeatureCollection', 
    features: [ 
     { 
      type: 'Feature', 
      geometry: { 
       type: 'Point', 
       coordinates: [40.73771, -73.9801] 
      }, 
      properties: {} 
     }, 
     { 
      type: 'Feature', 
      geometry: { 
       type: 'Point', 
       coordinates: [40.72661, -73.9897] 
      }, 
      properties: {} 
     } 
    ] 
}; 


var featureLayer = L.mapbox.featureLayer(geoJSON).addTo(map); 
map.fitBounds(featureLayer.getBounds()); 

是次要的東西,我忽視了。

回答

0

錯誤是我自己的。像我一樣,GeoJSON座標都是格式化[x,y]/[lon,lat]而不是[lat,lon]。這是小事。

L.mapbox.accessToken = 'pk.eyJ1IjoiZHJpemx5IiwiYSI6IkhMLXBmVGcifQ.CFEPrONMLQQJdiJ2NV9Qsg'; 
var map = L.mapbox.map('map', 'examples.map-i86nkdio').setView([40.7377, -73.9801], 12); 
//var map = L.mapbox.map('map', 'examples.map-i86nkdio'); 

geoJSON = { 
    type: 'FeatureCollection', 
    features: [ 
     { 
      type: 'Feature', 
      geometry: { 
       type: 'Point', 
       coordinates: [-73.9801, 40.73771] 
      }, 
      properties: {} 
     }, 
     { 
      type: 'Feature', 
      geometry: { 
       type: 'Point', 
       coordinates: [-73.9897, 40.72661] 
      }, 
      properties: {} 
     } 
    ] 
}; 


var featureLayer = L.mapbox.featureLayer(geoJSON).addTo(map); 
map.fitBounds(featureLayer.getBounds());