Question

是否有一种简单的方法来缩短GeoJSON图层上的线条？

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

以下是一个例子：

我有50 x 50的图标，但是半透明（见图片），我有一些线条转到图标的Lat / Long，但是我想尝试在线条进入图标之前裁剪或偏移线条，所以你看不到图标下面的那一行。这可能吗？

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

Answer 1

可以使用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/leaflet@1.2.0/dist/leaflet.css" />
    </head>
    <body>
        <div id="leaflet"></div>
        <script src="//unpkg.com/leaflet@1.2.0/dist/leaflet.js"></script>
    </body>
</html>

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

1 个答案: