问题描述
我是Leafletjs的新手.在cesiumjs上工作了一段时间，我们现在正在尝试制作传单.切换的主要原因是查看性能是否存在巨大差异.
I'm new to leafletjs. Been working on cesiumjs for a while and we are trying leaflet now. The main reason for the switch is to see if there's a huge performance difference.
在铯中，我绘制了一些原始点.在letletletjs中绘制140K点的最有效方法是什么?使用标记还是创建单个小圆圈?
In Cesium, I had a collection of primitive points that I plotted. What's the most efficient way of plotting 140K points in leafletjs? Using markers or creating individual little circles?
我也正在考虑使用集群插件( http://leafletjs.com/2012/08/20/guest-post-markerclusterer-0-1-released.html )，所以请分享对性能的任何看法.
I am also thinking of using the clustering plugin (http://leafletjs.com/2012/08/20/guest-post-markerclusterer-0-1-released.html), so please share any thoughts on performance.
推荐答案
您有2个常用选项:
-
在基于Canvas的图层中显示点，例如使用圆形标记并强制在画布上而不是SVG上渲染它们(另请参见 Leaflet MaskCanvas插件 ).圆形标记(即使在画布上)仍会发出事件，因此您可以检测到
"click"等.
Display your points in a Canvas-based layer, like using Circle Markers and force rendering them on a Canvas instead of SVG (see also Leaflet MaskCanvas plugin). Circle Markers, even on a canvas, still emit events, so you can detect
"click"etc.
使用集群插件，例如 Leaflet.markercluster插件.它可以处理您的140k点，具体取决于客户端的计算机性能(请参见 https: //github.com/Leaflet/Leaflet.markercluster#handling-lots-of-markers 和演示 http://leaflet.github.io/Leaflet.markercluster/example/marker-clustering-realworld.50000.html ，得分为50k，但请注意该演示使用旧版本的插件，而当前版本则更快.
Use a clustering plugin, like Leaflet.markercluster plugin that you mention for exampe. It can handle your 140k points, depending on the client's computer performance (see https://github.com/Leaflet/Leaflet.markercluster#handling-lots-of-markers and demo http://leaflet.github.io/Leaflet.markercluster/example/marker-clustering-realworld.50000.html with 50k points, but note that the demo uses an old version of the plugin, whereas the current version is even faster).
尝试在没有Canvas或群集的情况下显示140k点肯定会导致浏览器崩溃.
Trying to display your 140k points without Canvas or clustering will crash your browser for sure.
这篇关于在LeafletJS中绘制140K点的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！