Leaflet 将自定义图标与画布渲染传单一起使用

Leaflet 将自定义图标与画布渲染传单一起使用,leaflet,Leaflet,我需要在带有自定义图标的传单地图上绘制数千个点。使用标准L.marker的性能太慢,当我达到大约1500个标记时无法使用。我尝试使用L.circleMarker来解决这个问题,我能够画出数千个性能优异的点。不幸的是,使用L.circleMarker,我只能制作不同类型的圆,这不符合我的要求。我也不能利用集群,因为没有一种特别好的方法可以用不同的图标来集群这些不相关的标记 有没有一种方法可以在使用自定义图标的同时获得画布渲染的性能优势?花了几个小时研究后,我得出结论,传单不支持使用画布创建自定义图

我需要在带有自定义图标的传单地图上绘制数千个点。使用标准L.marker的性能太慢,当我达到大约1500个标记时无法使用。我尝试使用L.circleMarker来解决这个问题,我能够画出数千个性能优异的点。不幸的是,使用L.circleMarker,我只能制作不同类型的圆,这不符合我的要求。我也不能利用集群,因为没有一种特别好的方法可以用不同的图标来集群这些不相关的标记


有没有一种方法可以在使用自定义图标的同时获得画布渲染的性能优势?

花了几个小时研究后,我得出结论,传单不支持使用画布创建自定义图标

尽管有一个名为传单画布图标的插件,但它添加了该功能

我还没有测试它,但是这个例子看起来很好


我能够使用CircleMarker和,但我必须创建一个自定义CircleMarker类,如这里所述:

您可以使用
将所有图像仅添加到一个画布。您只需指向上一个航路点即可创建方向箭头

我制作了一个在画布上渲染标记的插件:


您可以将其与自定义标记一起使用。

您好,请使用此节点包装,

默认情况下,传单标记作为单独的DOM元素添加到html页面中,这很难处理这么多DOM

但该模块使用html画布标记在地图上绘制标记

这里是我的10000个标记的画布示例,性能令人惊讶,但我没有使用这个包。但我很快就会在我的项目中实现这一点。这一次,我以其他方式实现了canvas

演示->