加载外部数据到谷歌地图和建立热图

Load external data to google maps and build heatmap

本文关键字：建立 谷歌地图 外部 数据 加载      更新时间：2023-09-26

在我的数据库中，我有一套邮政编码和特定邮政编码的订单数量

zip    | count
--------------
12-456 |   23
12-100 |  120
12-220 |   93
10-300 |    2

我需要一种方法来显示数据的热图使用GoogleMaps。我在https://developers.google.com/maps/documentation/javascript/examples/layer-heatmap找到了一个基本的例子这是一个很好的开始，但它需要我把所有的点添加到我的页面。

是否有一个选项显示页面，然后做请求服务器得到所有的点?我知道，我可以使ajax请求服务器，得到json作为结果，然后在循环中添加这些点到taxiData(代码从例子)，但也许这可以做得更容易?在波兰有近23,000个邮政编码，所以我可以从服务器上获得非常大的数据集。

是否可以将数据加载为latitude, longitude, count ?我可以将邮政编码转换为位置(GPS坐标)，但我想发送该位置的订单数量。

如何显示特定区域的热图?如本例:http://maps.forum.nu/v3/gm_customTiles.html热图仅显示美国。

任何关于如何开始的想法(链接，示例)都是很大的帮助。

第一个问题:只是一个想法，你可以抽样邮政编码，让用户选择细节。如果他想要更多的细节，就得多花点时间来加载。在低地图缩放中，你不需要那么多的点。如果用户想要在更高的地图缩放中获得更多细节，你可以获取更多。但不要低估ajax，我有一个网站页面加载了大约9000个数据库条目，它在大约3秒内准备好了，也许更少。只是不要阻塞页面，不要忘记使用加载器:)

第二个问题:在SQL中可以使用

SELECT latitude, longitude, COUNT(*) count FROM Table GROUP BY latitude, longitude

这将为您提供唯一的经纬度对及其计数。如果你愿意，你可以玩小数点或多或少的精度。

第三个问题:那个地图使用了MCustomTileLayer。您可以在这里查看并下载源代码http://code.google.com/p/biodiversity-imageserver/source/browse/trunk/unittest/gmap3/MCustomTileLayer.js?r=49

该网站的例子:

var hMap = new MCustomTileLayer(map,theme);
var oDiv = document.getElementById('controlsDiv');
var tlcOptions = {
    parent: oDiv,
    overlay: hMap,
    caption: theme.toUpperCase()
}
var tlc = new MTileLayerControl(tlcOptions);

老实说，我更喜欢标准的谷歌API，它更简单，更漂亮。他们只是产生一个图像，并把它放在地图上。您可以使用热图半径来填充您想要的区域。

希望有帮助

相关文章：