需要在来自数据库结果的谷歌地图上显示大约 20,000 个图钉 [关闭]答案

【问题标题】：Need to Show around 20,000 pins on Google maps coming from Database result [closed]需要在来自数据库结果的谷歌地图上显示大约 20,000 个图钉 [关闭]
【发布时间】：2012-11-14 19:31:50
【问题描述】：

我必须在谷歌地图上将用户显示为图钉。我从数据库中获取了用户记录，现在大约有 20,000 条。我现在正在做的是做一个 ajax 请求以从数据库中获取所有用户，一旦加载了文档并创建了地图。但问题是，当我用大约 20,000 条记录的 json 结果响应 ajax 调用时，我的浏览器卡住了。有时需要 20 分钟才能加载结果并将它们显示为谷歌地图上的图钉。我确信这是错误的方法。

谁能指导我将数据库结果加载为谷歌地图上的图钉的最佳方法。请记住，每个请求的结果集可能不同（基于登录用户的城市 - 目的是显示附近的用户）。

提前非常感谢。

【问题讨论】：

20,000 同时在地图上会混淆您的客户将其分解为类别 .... 一次只显示大约 100 个
附近的 20000 个用户真的很感兴趣吗？例如，您不能将它们汇总到地点（即 20 个用户在 Joe 的酒吧，250 个用户在 Dance Plaza 等......？）并显示汇总的 pin？
这是一种特殊情况，当用户想要查看来自选定国家/地区的附近用户时。所有其他情况都可以正常工作，因为在这些情况下，用户数量会大大减少。我已经在使用集群了。我现在只需要处理特定场景以显示所选国家/地区的附近用户（它的重要要求，我无法避免！）
有了这么多标记，您需要使用自定义图块或 服务器端集群，V2 示例：maps.forum.nu/server_side_clusterer

标签： php mysql json google-maps google-maps-api-3

【解决方案1】：

这么大的数据量，尝试绘制 20,000 个图钉会很慢。

看看类似集群的东西 - http://gmaps-utility-library-dev.googlecode.com/svn/tags/markerclusterer/1.0/examples/advanced_example.html

或者，如果您只显示附近的用户，您真的有 20,000 个附近的用户吗？根据用户的当前位置缩小返回的用户列表。

【讨论】：

该示例使用已弃用的 API V2。
我已经在使用集群了
有了这么多标记，您需要使用自定义切片或 服务器端集群，V2 示例：maps.forum.nu/server_side_clusterer

【解决方案2】：

我真的希望将其保持在 100 个引脚以下 - 对于处理能力较低的设备来说，20,000 个引脚太多了。

如果您确定需要渲染所有图钉，那么您需要仔细考虑如何将信息提供给用户。您是要在页面加载时预加载所有信息，以便可以重复使用信息，还是希望在信息发生更改时重新加载信息。

无论如何，如果您以 XML 格式输出结果以供 Javascript 读取，则较小的 XML 文件会提供更快的加载时间。如果您使用的是 XML，则可以将其从...减少。

<records>
    <record id="1">
        <name>blah</name>
        <longatude>blah</longatude>
        <latitude>blah</latitude>
    </record>
        <record id="2">
        <name>blah</name>
        <longatude>blah</longatude>
        <latitude>blah</latitude>
    </record>
</records>

收件人：

<records>
    <record id="1" n="blah" lat="bah" lon="blah" />
    <record id="2" n="blah" lat="bah" lon="blah" />
    <record id="3" n="blah" lat="bah" lon="blah" />
</records>

如果您确定所有标记都是必需的，我会使用提到的 Google Maps Clustering here 这将减少任何时候在页面上呈现的数量。

【讨论】：

我已经在使用集群了。我需要在页面加载时加载图钉。
嗯，好吧 - 然后我会尝试减少 JSON 响应，就像上面的 XML 一样。即使对于这么多的针脚，20 分钟似乎也太长了。如果您是由靠近某个国家/地区的用户选择，那么将输出减少到仅这些用户会有所帮助。如果 JSON 包含有关单个用户的信息，请将其删除。例如，当用户单击 pin 时 - 然后对 DB 进行 AJAX 调用以获取信息。
20 分钟是估计时间，因为如果您在 FireFox 中工作，具有巨大数据集的 ajax 响应会消耗大量内存：)
你需要做的事情：1 - 最小化你正在解析的结果数量，2 - 减少结果格式的大小，3 - 像你一样使用聚类，4 - 测试本地机器和另一台服务器可能是为了比较。如果这些都不起作用，请粘贴您的代码，我们会看看。
谢谢@Chris，我刚刚浏览了这个网站link，他们显示了近2000条记录/引脚，但渲染时间非常快。

【解决方案3】：

我认为您可能不得不避免使用客户端。我还没有尝试过，但 Fusion Table Layers 似乎是您所追求的，它将处理保留在 googles 服务器上，您可以使用类似 sql 的查询。每个表和 5 个表限制为 100,000 行。

我不确定表格的设置，但它可能是一个有趣的替代方案。

https://developers.google.com/maps/documentation/javascript/layers#FusionTables

【讨论】：