Алгоритм для тепловой карты?

Question

У меня есть список значений, каждое из которых имеет широту и долготу. Я хочу создать полупрозрачное изображение тепловой карты для наложения на Google Maps. Я знаю, что уже существуют серверные и флэш-решения, но я хочу встроить их в javascript, используя тег canvas.

Однако я не могу найти краткое описание алгоритма, используемого для преобразования координат и значений в тепловую карту. Может кто-нибудь предоставить или ссылку на один?

Спасибо.

Answer 1

Основная идея состоит в том, чтобы создать сетку и спроектировать каждый широта и координату этой сетки. Я бы использовал двумерный массив целых.

Псевдо-код будет:

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 смежных ячейках.

Answer 2

Я пытался решить эту проблему в javascript с помощью элемента canvas, вот мой текущий результат:

http://gist.github.com/346165

Мне нужно исправить фильтр Гаусса и цветовое отображение, потому что в настоящее время он не дает хороших результатов.

Answer 3

Более быстрый способ построения тепловой карты - использовать очередь:

псевдокод:

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)
}

Это экономит тонны итераций!

Answer 4

Посмотрите на этот проект, если вы ищете что-то, что больше похоже на 'телевизионные карты погоды':

https://github.com/optimisme/javascript-temperatureMap