📜  LeafletJS-多段线和多边形(1)

📅  最后修改于: 2023-12-03 14:43:52.187000             🧑  作者: Mango

LeafletJS-多段线和多边形

介绍

LeafletJS是一个免费开源的JavaScript库,用于在Web上创建交互式的地图。本文将介绍该库中用于创建多段线和多边形的部分。

多段线

多段线是由多个线段依次连接而成的线条。在LeafletJS中,可以通过L.Polyline类创建多段线。

创建多段线
// 创建多段线
var polyline = L.polyline([
    [51.505, -0.09],
    [51.51, -0.1],
    [51.52, -0.12],
], {color: 'red'}).addTo(map);

以上代码创建了一个三个节点的多段线,并将其设为红色。

添加节点

可以通过addLatLng方法增加节点。

// 添加节点
polyline.addLatLng([51.53, -0.13]);

以上代码在原来的多段线上增加了一个节点。

多边形

多边形是由多个线段组成的闭合图形。在LeafletJS中,可以通过L.Polygon类创建多边形。

创建多边形
// 创建多边形
var polygon = L.polygon([
    [51.509, -0.08],
    [51.503, -0.06],
    [51.51, -0.047]
], {color: 'green'}).addTo(map);

以上代码创建了一个三个节点的多边形,并将其设为绿色。

添加节点

同样可以通过addLatLng方法增加节点。

// 添加节点
polygon.addLatLng([51.511, -0.065]);

以上代码在原来的多边形上增加了一个节点。

结语

以上就是本文对LeafletJS中多段线和多边形的介绍。如果想要了解更多关于LeafletJS的信息,请访问官方网站:https://leafletjs.com/