だから私は、管理者ユーザーがさまざまな停留所で特定の場所を巡る旅を作成できるようにするアプリを書いています。
地図の表示、マーカーの追加、flyTo の場所などに を使用してMapbox GLいます。
cURLAPIの実装を使用Mapboxして運転ルートを取得し、地図上に線を引いていました
呼び出しの例として、cURL自分の方向を表す座標のリストを受け取ります。
問題は、これらのポイントを地図上で接続しようとすると発生します。
HTMLいくつかの例としてJS
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title></title>
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.18.0/mapbox-gl.js'></script>
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.18.0/mapbox-gl.css' rel='stylesheet' />
<style>
body { margin:0; padding:0; }
#map { position:absolute; top:0; bottom:0; width:100%; }
</style>
</head>
<body>
<div id='map'></div>
<script>
mapboxgl.accessToken = '<ACCESS TOKEN>';
var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/streets-v8',
center: [-122.486052, 37.830348],
zoom: 15
});
map.on('load', function () {
map.addSource("route", {
"type": "geojson",
"data": {
"type": "Feature",
"properties": {},
"geometry": {
"type": "LineString",
"coordinates": [
[-155.088899,19.722942],[-155.08565,19.72472],[-155.084661,19.723701],[-155.083569,19.723139],[-155.079557,19.722262],[-155.074227,19.721938],[-155.069939,19.722545],[-155.070061,19.721225],[-155.07007,19.711726]
]
}
}
});
map.addLayer({
"id": "route",
"type": "line",
"source": "route",
"layout": {
"line-join": "round",
"line-cap": "round"
},
"paint": {
"line-color": "#888",
"line-width": 8
}
});
});
</script>
</body>
</html>
線を引くために接続される一連の座標を確認できます。これらのポイントを接続して、線が道路のみをたどるようにする方法があるかどうか疑問に思っていました(運転用)。
よりよく説明するために、これは出力のクローズズームです
私の問題の非常に一般的な説明であることは知っていますが、理解できることを願っています。
私はいくつかの魔法をやろうとしましMapbox Gl Directions APIたが、運がありません。追加しcontollerたくないものを追加する必要があります。ルートを描画するだけでよく、パブリック ユーザーがルートを変更できないようにします。
何かアドバイスはありますか？
