如何制作热像图，如Housing.com的价格热图

Question

我已经尝试了几个星期来提出价格图。我的灵感来自Housing.com网站上的热图。地图链接是： https://housing.com/dsl/heatmaps/mumbai/buy

我试过了： Google映射Javascript API 3 热图，js库 和许多其他网站。 我得到的结果地图在视觉上不太吸引人。 他们是否为非常小的区域定义了边界，然后引入了渐变（这也是我不知道如何实现的。） 欢迎任何有关如何实施的想法。

Answer 1

他们不会在应用程序或任何其他库中使用Google Maps Heatmaps Layer来创建热图。您可以看到网页发出的请求之间是this，this以及more等图片，以获得更大的缩放级别。他们只是将这些图像渲染为自定义样式的谷歌地图作为图块。

有关如何在Google地图上呈现自定义图块的详情，请查看this part of docs。有关如何为热图下方的地图设置样式的示例，请查看this parts of docs。

创建瓷砖图片以在谷歌地图上呈现可能会很麻烦，有一些工具，like this one应该可以帮助你，但付费。我不知道任何免费解决方案，您可以手动创建它，虽然可能需要一些时间。

希望这有助于您更好地理解引用地图背后的实现技术。