12

それぞれ緯度と経度の値のリストがあります。Googleマップにオーバーレイする半透明のヒートマップ画像を作成したいと考えています。サーバーサイドとフラッシュベースのソリューションがすでにあることは知っていますが、canvasタグを使用してjavascriptでこれを構築したいと思います。

ただし、座標と値をヒートマップに変換するために使用されるアルゴリズムの簡潔な説明が見つからないようです。誰かが提供またはリンクできますか?

ありがとう。

4

4 に答える 4

9

基本的な考え方は、グリッドを作成し、そのグリッドにすべてのlat、lng座標を投影することです。私はintの2D配列を使用します。

疑似コードは次のようになります。

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値が高いほど、そのセルは高温になるという考え方です。incremental_adjacent_cellsは、隣接する8つのセルすべての値をインクリメントする必要があります。

于 2010-02-26T18:12:14.327 に答える
4

私はcanvas要素を使用してjavascriptでこれを解決しようとしました、これが私の現在の結果です:

http://gist.github.com/346165

現在、良い結果が得られないため、ガウスフィルターとカラーマッピングを修正する必要があります。

于 2010-03-27T15:46:42.033 に答える
1

「テレビの天気図」に似たものを探している場合は、このプロジェクトを見てください。

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

于 2015-07-09T08:56:07.290 に答える