我是新來mapbox
我進口一些標記從一個CSV文件,我可以手動它們之間畫線,從每個端口到它的目的地。例如從摩洛哥到中國,但如果我向您展示我的地圖,則無法知道端口在哪裏,目的地是什麼:從摩洛哥到中國或相反。所以,因爲這個原因,我想從每個端口到目的地繪製一條動畫線。
目前我沒有任何代碼,我在下面的鏈接中找到如何繪製動畫線,但我不能在標記之間做,因爲它們討論的是正弦函數。
https://www.mapbox.com/mapbox.js/example/v1.0.0/dynamically-drawing-a-line/ 你能幫助我嗎?
謝謝!繪製兩個標記之間的動畫線MapBox
1
A
回答
3
在您鏈接的示例中,您可以更改add()
函數以在第一個點開始繪製並停止繪製最後一個點。理想情況下,您的標記按照您想要繪製的線的順序排列:
// add your points
var points = [
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [0, 0]
},
"properties": {}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [10, -10]
},
"properties": {}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [50, 50]
},
"properties": {}
}
]
// add a variable for keeping track of points
var y = 0;
// Start drawing the polyline.
add();
function add() {
// add a point on the line for the new marker
polyline.addLatLng(
L.latLng(points[y].geometry.coordinates[1],
points[y].geometry.coordinates[0])
);
// Pan the map along with where the line is being added.
map.setView(points[y].geometry.coordinates, 3);
// Continue to draw and pan the map by calling `add()`
// until `y` reaches the number of points
if (++y < points.length) window.setTimeout(add, 1000);
}
+0
這幫助我擺脫了漏洞! –
好的,您的研究成果是什麼?你有什麼嘗試?什麼沒有用?它給了什麼問題?任何錯誤?這到目前爲止不是遵守Stackoverflow標準的問題。請給這個很好和徹底的閱讀:http://stackoverflow.com/help/how-to-ask然後編輯你的問題。 – iH8
謝謝你的迴應,下次我會試着問一個好問題,這是我的第一個,這就是爲什麼! 我有很多問題,我從這開始: 好吧,我從csv文件導入一些標記,並且我可以在它們之間畫出線,從每個端口到其目的地。 但如果你看到地圖,你不知道從A到B或相反的方向。 所以,爲此,我想從每個端口繪製一個動畫方向到目的地。 目前我沒有任何代碼。 – Hichamisto
請編輯您的問題,將其添加到您的問題中,並添加您研究的內容以及發現的內容等。 – iH8