1

我正在设计一个应用程序,它在谷歌地图上显示近5万辆汽车,其中包含一些细节,如名称、编号和图片。

我想知道这样做的最佳做法是什么。有些人建议制作原生移动应用程序或桌面应用程序,但我需要一个可以在网络浏览器上运行的网络应用程序。数据将以JSON格式直接从服务器中提取。

我应该限制数据还是有一些解决方法?

谢谢

4

3 回答 3

3

正如评论中所建议的那样,您最好将要显示的 50K 数据点聚类。

即使在 24 英寸 1920x1080 显示器上看到 50K 数据点,意味着每个数据点大约有 41 个像素,这意味着每个数据点有 6x6 个像素方块,它们会填满整个屏幕。

很明显,你会有很多重叠。

此外,以 JSON 格式从服务器获取 50K 数据点(并且您可能会得到一个包含所有这些数据的大 json)意味着您将至少有 50k x 10 x 2 = 1,000,000 字节 = 每个 1MB请求从服务器拉取。(每个浮点数 50k 点 x 10 个字节,小数点后 5 个 x 2 个数字,因为您有纬度和经度)。

因此,如果您希望这是实时的,您可能必须每 2 秒左右发出这些请求。

此外,并非所有这些都适合视口,因此您必须排除那些不在视口中的内容,因为它们无论如何都不会显示。所以服务器应该知道客户端正在使用什么样的显示(分辨率)。

我认为最好的方法是让您在服务器端编写一些集群逻辑,让客户端处理更少的数据点。(我在这里聚类的意思是多个点被组合在一起,当放大时,它们开始展开成不同的组)

更新

还要考虑到随着 DOM 节点数的增加,选择器会运行得更慢,因为它们必须搜索许多节点。但是,如果您将标记放在一个图层中并且不让选择器接触该图层,那么您可以避免速度问题,这样他们就不会浪费时间。

更新#2

为了有效地发送数据,您可以使用BSON对其进行编码,然后将其压缩并将其传递到客户端,您可以使用zlib.js解压缩并使用BSON读取它。

我假设您将在服务器端使用 C++,但也有许多其他语言的 BSON 实现

更新#3

Also check the mqtt protocol which is a lightweight transport protocol. It has a Javascript implementation here MQTT.js

UPDATE #4: In some cases, some points might have kept their position since the last update, in which case, you wouldn't need to send their positions.

Similarly, depending on the speed of the points, and the zoom level, some points might appear as if they're not moving at all(if you're viewing them from really far away) so you might not want to send the positions of those points each time. So only sending those that would change position on the client-side display would make sense(since the other ones would appear as being static, although they're not).

于 2013-03-19T13:38:15.013 回答
0

IMHO, best way at such large number of object is using server-side rendering of raster.

于 2013-03-19T14:34:29.500 回答
0

Get all data at once but Draw only those markers which are on the view port or near the view port. ;)

于 2013-03-19T17:44:59.307 回答