2015-12-15 120 views
0

我一直在試圖讓我的地圖(下面的JS)能夠自動縮放到一個用於顯示的JSON文件的範圍(將有一些單獨的) ,但我似乎無法弄清楚我將如何實現這一目標。Mapbox GL JS API設置界限

var map = new mapboxgl.Map({ 
    container: 'map', // container id 
    style: 'mapbox://styles/mapbox/streets-v8', //stylesheet location 
    center: [-79.376828,43.635570], // starting position 
     zoom: 12, 
     pitch: 07, // pitch in degrees 
     bearing: -16.1// bearing in degrees 
    }); 


map.on('style.load', function() { 

    map.batch(function (batch) { 

     //////////////////////////// 
     //ADDSOURCE for 0 
     map.addSource("0", { 
      "type": "geojson", 
      "data": { 
       "type": "Feature", 
       "properties": {}, 
       "geometry": { 
        "type": "LineString", 
        "coordinates": [[-79.378821,43.645557],[-79.378862,43.645594],[-79.378909,43.645616],[-79.418429,43.635570],[-79.413358,43.636944]] 

       } 
      } 
     }); 

     //ADDLAYER for 0 
     map.addLayer({ 
      "id": "0", 
      "type": "line", 
      "source": "0", 
      "layout": { 
       "line-join": "round", 
       "line-cap": "round" 
      }, 
      "paint": { 
       "line-color": "#0324a7", 
       "line-width": 3 
      } 
     }); 
     //////////////////////////// 
     //ADDSOURCE for 1 
     map.addSource("1", { 
      "type": "geojson", 
      "data": { 
       "type": "Feature", 
       "properties": {}, 
       "geometry": { 
        "type": "LineString", 
        "coordinates": [[-79.418429,43.635570],[-79.413358,43.636944],[-79.413197,43.636982],[-79.378821,43.645557],[-79.378862,43.645594]] 

       } 
      } 
     }); 

     //ADDLAYER for 1 
     map.addLayer({ 
      "id": "1", 
      "type": "line", 
      "source": "1", 
      "layout": { 
       "line-join": "round", 
       "line-cap": "round" 
      }, 
      "paint": { 
       "line-color": "#0324a7", 
       "line-width": 3 
      } 
     }); 

    });//BATCH 



}); 
map.fitBounds(map.getBounds()); 

map.addControl(new mapboxgl.Navigation()); 
map.scrollZoom.disable(); 

我一直在使用的map.fitBounds(map.getBounds())各種組合嘗試過,但我似乎沒怎麼弄清楚如何讓地圖推出的第一JSON的範圍。任何幫助將不勝感激。另外,我應該以不同的方式(除了使用map.batch(function (batch))加載多個不同的JSON文件嗎?

+0

見:http://stackoverflow.com/questions/35586360/mapbox-gl-js-getbounds-fitbounds – daviestar

回答

0

據我所知(並可以搜索),目前沒有辦法從mapboxgl.GeoJSONSource對象中派生出界限。你需要自己計算一下。之後,你可以使用mapboxglfitBounds方法:

map.fitBounds([ 
    [-79.418429, 43.63557], 
    [-79.378821, 43.645616] 
]);