openlayers、decarta 和 google 地图之间的性能差异
我们最近将公司地图系统从 Google 地图过渡到 deCarta,然后过渡到 OpenLayers。我们发现,当向地图添加许多元素(数千个)(点击时带有气泡的图钉)时,OpenLayers 和 deCarta 的速度明显慢于 Google 地图。谷歌有标记管理器,它似乎使它更快,但我不明白的是它如何减少内存使用或其他使它执行得更好的东西。这让我抓狂,因为我们在 OL 和 deCarta 上做的事情和在 Google 上做的一样,而其他的速度太慢了。有人有使用这些系统的经验吗?
我知道谷歌是地图技术领域的巨头,因此在该系统上投入了大量资金,所以它的速度更快也就不足为奇了。我只是想知道如果可能的话怎么办。
谢谢!
We have recently been transitioning our company mapping system from Google map, first to deCarta and then to OpenLayers. We have found that OpenLayers and deCarta are remarkably slower than Google Maps when many elements (several thousand) are added to the map (pins with bubbles on click). Google has the Marker Manager which appears to make it faster, but what I can't figure out is how this cuts down the memory usage or whatever to make it perform so much better. It's driving me nuts because we do the same thing with both OL and deCarta as we do with Google and the others are so slow. Does anyone have any experience in working with these systems?
I know that Google is the massive giant of mapping technology and therefore has put enormous amounts of money into the system, so it's not surprising that it's faster. I just want to know HOW if at all possible.
Thanks!
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(5)
Google 地图在显示这么多标记时表现更好的主要原因是它们使用 HTML5 Canvas 来呈现标记而不是每个标记的图像节点。当浏览器在平移或缩放时需要重新绘制地图时,它必须重新绘制图层容器中的所有元素。元素越少,性能越好。 OpenLayers 对 Canvas 有一些支持,但我不知道 Canvas 中有任何标记渲染器。您还必须自己检测对标记的点击,因为您不再有可以点击的节点 pr 标记。
在我工作的地方,我们在服务器端生成图像,并使用老式图像映射来使图像区域可单击。这是我们在 Canvas 出现之前很久就制定的解决方案,所以我不推荐它,但它也适用于较旧的浏览器。如果标记非常静态,我宁愿像其他人建议的那样使用 WMS,或者使用 Canvas 自行实现。
请注意,Canvas 规范仍然是一个工作草案,在旧版浏览器中不可用:http://caniuse.com/canvas
The main reason why Google Maps perform better when displaying that many markers is because they use HTML5 Canvas to render the markers instead of an image node for each marker. When the browser needs to re-paint the map when panning or zooming, it has to re-paint all the elements in the layer container. Less elements, better the performance. OpenLayers has some support for Canvas, but I'm not aware of any marker renderers in Canvas. You will also have to detect clicks on markers on your own, since you no longer have a node pr marker to click on.
Where I work we generate an image server-side and use an old-school image map to make areas of the image clickable. It's a solution we made long before Canvas existed, so I wouldn't recommend it, but it also works in older browsers. If the markers are quite static I'd rather use a WMS like others have suggested, or implement it on your own with a Canvas.
Beware, the Canvas spec is still a working draft, and not available in older browsers: http://caniuse.com/canvas
通过 OL API 放入地图中的任何标记/几何图形都必须下载到浏览器,然后在浏览器的内存中渲染。
如果您在地图上渲染了许多几何图形,则可以仅使用这些几何图形创建一个额外的图像层。您可以使用 Geoserver 等 WMS 来做到这一点。 Geoserver 与 OpenLayers 配合得非常好,并且是一个相当快的 WMS。因此,您可以将 OSM 或 GoogleMaps 等公共背景图层与您自己的 WMS 中的图层结合起来。
此方法可能不适用于可点击标记,但当您在地图上显示任何绘制的几何图形(如多边形等)时,会提高速度。
问候,史蒂夫
Any Marker/Geoemtry you put into the map via the OL API has to be downloaded to the browser and then rendered in the browser's memory.
If you have many geometries that you render onto the map, you can make an extra image layer with just these geometries. You can do that by using a WMS like Geoserver. Geoserver plays very nice with OpenLayers and is a pretty fast WMS. So you can combine the public a background layer like OSM or GoogleMaps with layers from your own WMS.
This approach might not work for clickable markers, but will improve speed when you show any painted geometries like polygons etc. on the map.
Greetings, Steve
我认为您正在使用 OpenLayers.Strategy 中的类之一(例如 Filter 或 Cluster)来减少实际显示的标记数量?我没有使用过谷歌地图,但听起来好像标记的经理做了同样的事情。最终,在渲染大量 dom 对象时,这两个库都受到相同的浏览器限制。
I take it you are using one of the classes in OpenLayers.Strategy, such as Filter or Cluster, to reduce the number of markers that are actually displayed? I haven't used Google maps, but it sounds as though marked manager does the same kind of thing. Ultimately, both libraries are constrained by the same browser limitations when it comes to rendering large number of dom objects.
Google 地图和 Open Layers 只是浏览器客户端的 JS 框架。这应该没有太大区别。我认为谷歌地图服务器基础结构更有效一些。另外,标记管理器不是一个非常好的软件(不是开源爱好者解决方案吗?),尽管它是 JS 和客户端,但我已经使用空间填充曲线破坏了我自己的集群管理器,并且它工作得相当好好的。我敢打赌它比标记管理器更好,因为网络上也有其他集群解决方案,对我来说它们更好。
Google maps and Open Layers are just JS-Framework for the Browser-Client. That shouldn't make much difference. I think it is Google Maps server infractstructure that is a little bit more effective. Also Marker Manager isn't a very good software (isn't it open-source enthusiast solution?) altough it is JS and client-side but I've clobbered myown cluster-manager using a space-filling-curve and it works fairely good. I bet it is better then Marker Manager because there are other cluster-solution in the web too and to me they are better.
我在 deCarta 上遇到了同样的问题,浏览器因大约 800 个引脚元素而变慢(点击时有气泡),我向 Krishna Vanka(不再在 deCarta 工作)询问了这个问题,但我没有得到任何解决方案,所以我们通过缩放参数构建一个新的过滤器,并协调绘画元素和缓存离屏元素,这样我们就可以在内存中获得大约 2000 个引脚,当然,这不是最好的方法,但它确实有效。
我们的系统(GPS WebApp)中的问题在于几何图形和引脚是由用户绘制的,因此不可能有额外的图像层。
I've experienced the same issue with deCarta, the browser goes slower with 800 approx pins elements (with bubble on click), I asked Krishna Vanka(who no longer works at deCarta) about this but I don't get any solution so we build a new filter by zoom parameter and coordinates painting elements and caching offscreen elements so we can get on memory about 2000 pins, of course, is not the best way but it works.
The problem in our system (GPS WebApp) with geometries and pins it's that are drawn by users so extra image layers is not a possibility.