Leaflet GeoJSON可以在到达目的地之前裁剪线条特征吗？

有没有缩短GeoJSON图层上线条的简单方法？Leaflet GeoJSON可以在到达目的地之前裁剪线条特征吗？

我有一条线，它从A点到B点。我希望线能够停止标记的半径，而不是它的终点。那可能吗？有点像线路终点/起点的偏移量。

下面是一个例子：

我有一个50×50的图标，但半透明（见图片），我有去的图标的纬度/龙线，但我想尝试种植或者在线条进入图标之前偏移线条，因此您无法在图标下看到线条。这可能吗？

如果这个问题不清楚，请发表评论。

2017-10-05 Arel

，可以使用dashArray和dashOffset选项来完成：

var map = new L.Map('leaflet', { 
 
    center: [0, 0], 
 
    zoom: 0 
 
}); 
 

 
new L.CircleMarker([0, 90], {radius: 30}).addTo(map); 
 
new L.CircleMarker([0, -90], {radius: 30}).addTo(map); 
 

 
var polyline = new L.Polyline([[0, -90], [0, 90]]).addTo(map); 
 

 
// Get length of the line 
 
var totalLength = polyline.getElement().getTotalLength(); 
 

 
polyline.setStyle({ 
 
    // Set dashArray to the length of the line minus radius * 2 
 
    dashArray: totalLength - 60, 
 
    // Offset by radius 
 
    dashOffset: -30 
 
});

body { 
 
    margin: 0; 
 
} 
 

 
html, body, #leaflet { 
 
    height: 100%; 
 
}

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
     <title>Leaflet 1.2.0</title> 
 
     <meta charset="utf-8" /> 
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
 
     <link type="text/css" rel="stylesheet" href="//unpkg.com/[email protected]/dist/leaflet.css" /> 
 
    </head> 
 
    <body> 
 
     <div id="leaflet"></div> 
 
     <script src="//unpkg.com/[email protected]/dist/leaflet.js"></script> 
 
    </body> 
 
</html>

来源

2017-10-06 12:16:15 iH8

看起来你也应该更新' “zoomend”'事件之后的风格。 – ghybs

有些事情必须作为练习给读者开放;）@ghybs – iH8

哇。令人印象深刻的黑客。 – IvanSanchez

Leaflet GeoJSON可以在到达目的地之前裁剪线条特征吗？

回答

相关问题