繪製兩個標記之間的動畫線MapBox

我是新來mapbox
我進口一些標記從一個CSV文件，我可以手動它們之間畫線，從每個端口到它的目的地。例如從摩洛哥到中國，但如果我向您展示我的地圖，則無法知道端口在哪裏，目的地是什麼：從摩洛哥到中國或相反。所以，因爲這個原因，我想從每個端口到目的地繪製一條動畫線。
目前我沒有任何代碼，我在下面的鏈接中找到如何繪製動畫線，但我不能在標記之間做，因爲它們討論的是正弦函數。
https://www.mapbox.com/mapbox.js/example/v1.0.0/dynamically-drawing-a-line/ 你能幫助我嗎？
謝謝！繪製兩個標記之間的動畫線MapBox

來源

2015-10-07 Hichamisto

好的，您的研究成果是什麼？你有什麼嘗試？什麼沒有用？它給了什麼問題？任何錯誤？這到目前爲止不是遵守Stackoverflow標準的問題。請給這個很好和徹底的閱讀：http://stackoverflow.com/help/how-to-ask然後編輯你的問題。 – iH8

謝謝你的迴應，下次我會試着問一個好問題，這是我的第一個，這就是爲什麼！我有很多問題，我從這開始：好吧，我從csv文件導入一些標記，並且我可以在它們之間畫出線，從每個端口到其目的地。但如果你看到地圖，你不知道從A到B或相反的方向。所以，爲此，我想從每個端口繪製一個動畫方向到目的地。目前我沒有任何代碼。 – Hichamisto

請編輯您的問題，將其添加到您的問題中，並添加您研究的內容以及發現的內容等。 – iH8

在您鏈接的示例中，您可以更改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); 
}

來源

2015-10-08 19:17:35

這幫助我擺脫了漏洞！ –

繪製兩個標記之間的動畫線MapBox

回答

相關問題