绘制两个标记之间的动画线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

回答

相关问题