我正在设计一个应用程序,该应用程序几乎可以在Google Map上显示5万辆汽车,并提供一些名称,号码和图片等详细信息。
我想知道什么是最佳做法。有些人建议制作本机移动应用程序或桌面应用程序,但我需要一个可以在Web浏览器上运行的Web App。数据将以JSON格式直接从服务器中提取。
我应该限制数据还是可以解决?
谢谢
最佳答案
如注释中所建议,最好将要显示的50K数据点聚类。
即使在24英寸1920x1080显示器上也能看到5万个数据点,这意味着每个像素约有41个像素,这意味着每个像素有6x6像素的正方形,它们将填满整个屏幕。
显然,您将有很多重叠之处。
此外,以JSON的方式从服务器中获取5万个数据点(您可能会用它们全部获取一个大json),这意味着每个数据块至少要有50k x 10 x 2 = 1,000,000字节= 1MB请求从服务器中拉出。
(50k点x每个浮点数10个字节,带5个小数点x 2个数字,因为您有经纬度和经度)。
因此,如果您希望这是实时的,则可能必须每2秒左右发出一次这些请求。
另外,并非所有这些都适合视口,因此您必须排除那些不在视口中的视口,因为它们无论如何都不会显示。因此服务器应该知道客户端正在使用哪种显示(分辨率)。
我认为最好的方法是让您在服务器端编写一些集群逻辑,而让客户端处理更少的数据点。
(我的意思是在这里聚类,就是多个点得到grouped together,并且在放大时,它们start unfolding分成单独的组)
更新:
还应考虑到,随着DOM节点数量的增加,选择器的运行速度会变慢,因为它们必须搜索许多节点。但是,如果将标记放在一个图层中,并且不要让选择器接触该图层,这样就不会浪费时间,您可以在此处避免速度问题。
更新#2:
为了有效地发送数据,您可以使用BSON对其进行编码,然后使用zip对其进行编码,然后将其传递到客户端,您可以在其中使用zlib.js解压缩并使用BSON进行读取。
我假设您将在服务器端使用C ++,但是也有BSON implementations for many other languages。
更新#3:
还要检查mqtt protocol,它是轻量级的传输协议。在这里MQTT.js具有Javascript实现
更新#4:
在某些情况下,自上次更新以来某些点可能会保留其位置,在这种情况下,您无需发送其位置。
同样,根据点的速度和缩放级别,某些点可能会
看起来好像它们根本没有移动(如果您从很远的地方查看它们),因此您可能不想每次都发送这些点的位置。
因此,仅发送那些会更改客户端显示位置的内容
会很有意义(因为其他的看上去不是静态的,尽管它们不是静态的)。