Algoritmo para el mapa de calor?

Question

Tengo una lista de los valores de cada uno con la latitud y longitud. Estoy mirando para crear una imagen de mapa de calor translúcida de la superposición en Google Maps. Sé que hay del lado del servidor y parpadean las soluciones basadas ya, pero quiero construir esto en JavaScript utilizando la etiqueta de la lona.

Sin embargo, me parece que no puede encontrar una descripción concisa del algoritmo utilizado para convertir las coordenadas y valores en un mapa de calor. ¿Alguien puede disponer o enlazar con uno?

Gracias.

Answer 1

La idea básica sería la creación de una red y proyectar cada lat, coord GNL a la red. Me gustaría utilizar una matriz 2D de enteros.

El pseudo-código sería:

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

Por lo tanto, la idea es que cuanto mayor sea el valor int, más caliente que la célula es. increment_adjacent_cells deberían incrementar los valores en los 8 células adyacentes.

Answer 2

Me han tratado de resolver esto en JavaScript utilizando el elemento canvas, aquí está mi resultado actual:

http://gist.github.com/346165

Tengo que fijar el filtro gaussiano y la asignación de colores, ya que no da buenos resultados actualmente.

Answer 3

Mira a este proyecto, si está buscando algo que se parece más 'tiempo de la tv mapas':

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

Answer 4

Una manera más rápida de construir un mapa de calor podría ser el uso de una cola:

Pseudocódigo:

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

Esto ahorra toneladas de iteraciones!