javascript – 地图中浏览器的最大svg元素数

我正在用传单和d3创建一个地图.很多圆圈都会在地图上绘制出来.在浏览器兼容性方面,预计会限制浏览器可以呈现多少svg元素.然而,就用户体验而言,我希望用户可以在地图上看到尽可能多的元素(否则用户可能需要不断地放大和缩小,并且需要等待ajax返回数据).我需要考虑一些优化(用户等待时间用户与服务器查询负载与浏览器可以处理的内容相比).

请参见图,现在对服务器返回的点数有一个限制,因此只填充了一部分地图.

浏览器无法在此处理完全填充的映射,用户也需要等待太长时间才能响应服务器响应.

我想通过回答两个问题需要解决我面临的问题:

>根据地图上简单svg形状(圆圈)的数量,一般浏览器可以处理的标准是什么?
>在地图上显示尽可能多的形状的最佳技术是什么?

我正在考虑以下几点,但我不确定它是否会有所帮助;

>使用正方形而不是圆形
>使用传单API而不是D3

解决方法:

一般来说,你所考虑的两点都没有帮助.在这两种情况下,要完成的处理量/浏览器要显示的信息将大致相同.

关于你的第一个问题,不是我所知道的.浏览器和平台之间存在巨大差异(特别是如果您考虑移动设备),平均值几乎毫无意义.此外,这种情况在不断变化.我发现多达1000个简单的形状通常不是问题.

要在地图上显示尽可能多的形状,我会将它们预先渲染为位图图块,然后使用传单API或类似d3.geo.tile(示例here)将其覆盖在实际地图上.这样您就可以轻松扩展到数百万个点.

上一篇:javascript – 获取Leaflet中当前地图范围内的标记/图层列表


下一篇:javascript – 如何在Leaflet.js中更改地图中心