GWT 上的热图（密度图）答案

【问题标题】：Heatmap (density map) on GWTGWT 上的热图（密度图）
【发布时间】：2009-12-06 23:48:01
【问题描述】：

我想在图像上创建一个热图（密度图）。 http://www.heatmapapi.com/Sample_Google.aspx 中的例子就是我尝试做的很好的例子。

有没有一种 GWT 方法可以实现这一点？或者您可以建议的任何好的（flash 或 js）解决方案（除了Heatmap Tools For Web Apps 提到的那些）？

【问题讨论】：

【解决方案1】：

我在大学最后一年的项目中实现了类似的东西。我使用了与 HeatMap API 相同的方法，在重新定位时将生成的图像覆盖在地图上。

我编写了一个自定义 Java Web 服务器，它接受查询字符串中的边界框坐标，以生成一个看起来有点像热图的半透明 PNG 图像，但这绝不是一个正确的统计正确算法。当时我找不到任何用于创建热图的算法，并且在网上或期刊中找到的许多算法实际上是用于集群热图/树图而不是密度热图。

我为数据生成了一个二维数组，使用一个函数将每个坐标映射到一个值。添加到数组中会增加值，因此需要将数组标准化为 0-255 之间的值，然后可以轻松地将其着色并输出到画布上。这个恐怕找不到源代码，算法很近似。

大约一年前，当 BNP（英国种族主义政党）的成员名单被泄露时，我遇到了另一个（更简单，但可能更不准确）的解决方案，该解决方案在每个针脚处放置了一个 PNG 热点，从而创建热图的效果。这里有这个截图，虽然找不到原图http://www.labourlist.org/revealed_the_bnps_social_media_strategy_mark_hanson

【讨论】：

目前我开发了类似的东西，但这不是我想要的确切结果，但感谢您的洞察力
我在 heroku 上使用 imagemagick 实现了一个解决方案，它在 heatmap.me 上，感谢您的洞察

【解决方案2】：

据我所知，GWT 中没有任何东西可以用来制作热图，至少官方 SDK 中没有。我想说对您来说最快的方法是将现有的 JS 解决方案集成为本机函数，并从您当前的 GWT 代码中使用它。

【讨论】：

有没有推荐的js解决方案？（或以前使用过）
很抱歉，我以前从未实现过热图。选择你可以使用的任何 JS 库，让它在一个虚拟的 HTML 页面中工作，然后将你需要使用的所有方法包装到 GWT JSNI 方法中。
你可以在这里找到 JSNI 文档code.google.com/webtoolkit/doc/1.6/…

【解决方案3】：

基本上有两种方法。一种是直接来自 GWT 的“hacky”且不是很优雅的方式，另一种使用 Google Visualization API。

hacky 方法包括构建一个表并将数据放入其中。此外，您需要决定如何将数据值“分箱”到范围中，然后为分箱分配颜色（您在 CSS 文件中指定）。随后，您使用列/行格式化程序将适当的 CSS 附加到表格单元格。我实际上已经在 GWT 中以这种方式完成了热图，并且可以正常工作....

非 hacky 方法是转到 Google Visualisations API 并使用 JSNI 包装 GWT 中已经存在的热图。

【讨论】：