我想在传单地图上渲染大约 10.000 个标记或点。我已经按照常规方式进行了操作，并且发现它与 Google Maps 相比要慢得多。我正在寻找一种方法来呈现多个元素而不会出现性能问题。
有没有办法用 Leaflet 做到这一点？
更新：我不想用无法处理事件的亮点进行绘图。我真的想用不同的颜色和事件绘制标记。
【问题讨论】：
性能问题是由于每个标记都是一个单独的 DOM 元素。浏览器在渲染数以千计的文件时遇到了困难。
在您的情况下，一个简单的解决方法是使用Circle Markers 并将它们呈现在画布上（例如使用地图preferCanvas 选项，或使用您作为renderer 选项传递的特定canvas renderer您的每个圆圈标记）。这就是谷歌地图默认的工作方式：它的标记实际上是在画布上绘制的。
var map = L.map('map', {
preferCanvas: true
});
var circleMarker = L.circleMarker(latLng, {
color: '#3388ff'
}).addTo(map);
或
var map = L.map('map');
var myRenderer = L.canvas({ padding: 0.5 });
var circleMarker = L.circleMarker(latLng, {
renderer: myRenderer,
color: '#3388ff'
}).addTo(map);
使用此解决方案，每个 Circle Marker 不再是一个单独的 DOM 元素，而是由 Leaflet 绘制到一个 单个 Canvas 上，这对于浏览器来说更容易处理。
此外，Leaflet 仍会跟踪鼠标位置和相关事件，并在您的 Circle Markers 上触发相应事件，以便您仍然可以监听此类事件（如鼠标单击等）。
100k 积分的演示：https://jsfiddle.net/sgu5dc0k/
【讨论】：
您应该检查https://github.com/robertleeplummerjr/Leaflet.glify。它提供了使用 web gl 渲染传单点和多边形的方法，允许更轻松地进行缩放。
它也适用于使用 R 制作传单的人： https://github.com/tim-salabim/leaflet.glify
R 版本超级简单。
【讨论】：
我使用官方 Leaflet 插件 PixiOverlay 获得了不错的效果。 https://github.com/manubb/Leaflet.PixiOverlay
【讨论】：
[2019]
也许有点太晚了，但 Pedro Vicente 的回答似乎是最好的选择。 Leaflet.glify (https://github.com/robertleeplummerjr/Leaflet.glify.) 很好，但除了在地图上创建点、形状和线条外，您别无选择。 （还没有自定义。） PixiOverlay 使用原生/自定义标记。它还具有很好的可视化效果（动画、缩放等）。它也适用于 IE 11。对我来说，如果你要处理大量的标记，这是必须的。去试试吧https://github.com/manubb/Leaflet.PixiOverlay
P.S Glify 和 PixiOverlay 都在使用 WebGL，因此性能会因用户的计算机而异。
【讨论】：
您可以查看标记集群，它可以集群您的地图，直到您放大以获取详细信息。我目前正在加载房地产信息，它似乎解决了在地图上放置超过 300000 个地点的问题。
【讨论】：