Question

我使用Leaflet 1.0 beta作为平铺图像查看器，因此我不需要任何花哨的坐标翻译，GeoJSON等。

我希望能够将立方贝塞尔线添加到叠加层，最好与SVG d属性的工作方式相同，因为Leaflet似乎只支持多边形路径（直线）。有没有一种简单的方法来实现这一点（例如通过扩展Polygon类）？

我已尝试直接更改路径的d属性，但在视图更改时会重绘它们。
我也试过使用turfjs' bezier splines，但显然我不支持我想要的东西，只是平滑坐标列表。

Answer 1

我创建了一个Leaflet plugin来绘制贝塞尔曲线。路径数据的格式类似于SVG路径命令，但仅支持绝对命令：

var path = L.curve(['M',[50.54136296522163,28.520507812500004],
                    'C',[52.214338608258224,28.564453125000004],
                        [48.45835188280866,33.57421875000001],
                        [50.680797145321655,33.83789062500001],
                    'V',[48.40003249610685],
                    'L',[47.45839225859763,31.201171875],
                        [48.40003249610685,28.564453125000004],'Z'],
                    {color:'red',fill:true}).addTo(map);

Answer 2

您可以使用turf-bezier从任何LineString几何体中创建插值贝塞尔曲线。

Bezier spline @ http://turfjs.org/

从tmcw @ In Mapbox.js, how to smooth a polyline?

中采取的答案

将立方贝塞尔曲线添加到Leaflet路径

2 个答案: