当前位置：文江博客话题详情

热图算法？

发布于 2024-08-23 06:40:03 字数 185 浏览 6 评论 0原文

我有一个值列表，每个值都有纬度和经度。我正在寻找创建一个半透明的热图图像以叠加在 Google 地图上。我知道已经有服务器端和基于 Flash 的解决方案，但我想使用 canvas 标签在 javascript 中构建它。

但是，我似乎找不到用于将坐标和值转换为热图的算法的简明描述。任何人都可以提供或链接到一个吗？

谢谢。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

苍景流年 2024-08-30 06:40:03

基本思想是创建一个网格并将每个经纬度坐标投影到该网格。我会使用二维整数数组。

伪代码是：

for each coord
  cell = coord projected to grid
  increment cell value
end

for 0 to # of passes
  for each row
   for each col
     if grid[row,col] > 0 then
       grid[row,col] += 1
       increment_adjacent_cells(row, col)
     end
   end
  end
end

所以，这个想法是 int 值越高，该单元格越热。 increment_adjacent_cells 应增加所有 8 个相邻单元格中的值。

The basic idea would be to create a grid and project every lat,lng coord to that grid. I would use a 2D array of ints.

The psuedo-code would be:

for each coord
  cell = coord projected to grid
  increment cell value
end

for 0 to # of passes
  for each row
   for each col
     if grid[row,col] > 0 then
       grid[row,col] += 1
       increment_adjacent_cells(row, col)
     end
   end
  end
end

So, the idea is that the higher the int value, the hotter that cell is. increment_adjacent_cells should increment the values in all 8 adjacent cells.

回复收藏 0 原文

树深时见影 2024-08-30 06:40:03

我尝试使用canvas元素在javascript中解决这个问题，这是我当前的结果：

http://gist.github .com/346165

我必须修复高斯滤波器和颜色映射，因为它目前没有给出好的结果。

回复收藏 0 原文

站稳脚跟 2024-08-30 06:40:03

构建热图的更快方法可能是使用队列：

伪代码：

Add an element to queue (first in heatmap(x,y, val))
While (!queue.isEmpty())
{
    elem = queue.pop()
    queue.push(elem.x + 1, elem.y, val-1)
    queue.push(elem.x - 1, elem.y, val-1)
    queue.push(elem.x, elem.y + 1, val-1)
    queue.push(elem.x, elem.y - 1, val-1)
}

这可以节省大量迭代！

A faster way of building a heatmap could be to use a queue:

Pseudocode:

Add an element to queue (first in heatmap(x,y, val))
While (!queue.isEmpty())
{
    elem = queue.pop()
    queue.push(elem.x + 1, elem.y, val-1)
    queue.push(elem.x - 1, elem.y, val-1)
    queue.push(elem.x, elem.y + 1, val-1)
    queue.push(elem.x, elem.y - 1, val-1)
}

This saves on tons of iterations!

回复收藏 0 原文