2014-03-12 115 views
4

我不是在編碼和當前使用的mapbox API來創建點上的地圖非常好。但是,在使用「地理定位」的用戶位置和我的地圖上的點之間的基本路線選項上找不到任何東西。有沒有辦法在API中做到這一點。我想創建爲用戶找到自己的方式,以我目前有在地圖上和這些位置之間的位置的選項。您的幫助將是最感謝。Mapbox路由使用mapbox API

問候

+0

歡迎堆棧溢出!你能告訴你正在使用哪種語言? – atxe

回答

2

我用Mapbox.directions插件來做到這一點。我使用地圖contextmenu事件在一個位置得到右擊事件(我的標記具有可點擊:false,這樣的地圖獲取鼠標點擊)。我使用的MouseEvent數據獲取經緯度和我設置爲任何來源或路線的目的地。我允許插件查詢路線和使用控件來顯示的路線,指示和地圖上突出顯示的路徑。以下是一些片段:

$('#lblStatus').html("Calculating route...."); 

// **** units is not working yet in the current Mapbox release 
moDirections = L.mapbox.directions({ 
    profile: 'mapbox.driving', 
    units: 'metric' 
}); 

moDirections.on('load', function (directions) { 
    // Loop through all route coordinates and determine bounds for route. 
    var minLat = 90, minLng = 180, maxLat = -90, maxLng = -180; 
    var lat, lng; 
    directions.routes[0].geometry.coordinates.forEach(function (laCoordinate, index) { 
     lat = laCoordinate[1]; 
     lng = laCoordinate[0]; 
     if (lat < minLat) { 
      minLat = lat; 
     } 
     if (lng < minLng) { 
      minLng = lng; 
     } 
     if (lat > maxLat) { 
      maxLat = lat; 
     } 
     if (lng > maxLng) { 
      maxLng = lng; 
     } 
    }); 
    var loBounds = L.latLngBounds(L.latLng(minLat, minLng), L.latLng(maxLat, maxLng)); 
    moMap.fitBounds(loBounds); 

    $('#lblStatus').html(""); 
}); 

moDirections.setOrigin(loStart); 
moDirections.setDestination(loEnd); 
moDirections.query(); 

moDirectionsLayer = L.mapbox.directions.layer(moDirections).addTo(moMap); 
moDirectionsErrorsControl = L.mapbox.directions.errorsControl('pnlRouteErrors', moDirections); 
moDirectionsRoutesControl = L.mapbox.directions.routesControl('pnlAlternateRoutes', moDirections); 
moDirectionsInstructionsControl = L.mapbox.directions.instructionsControl('pnlRouteInstructions', moDirections); 

上述pnl *元素是注入控件的div。

這時有基本的方向插件的文檔。你可以在這裏得到開放的源代碼:https://github.com/mapbox/mapbox-directions.js

唯一的例子是在這裏:https://www.mapbox.com/mapbox.js/example/v1.0.0/mapbox-directions/但我已經找到了輸入控制不能很好地工作,不適合我的設計。