Monday, July 9, 2012

Create geo-referenced heat maps Google Mapplet

Comma-separated-values (CSV) of statistical data in the format latitude, longitude, and magnitude can be imported and visualized as heat maps in Google Maps using this custom mapplet. An example screenshot is shown below.



While the heat maps feature is already possible using the Google Docs FusionTable object, the heat maps created from this Mapplet is done using the HTML5 canvas object via the Javascript heatmap.js library. On  top of that, the Mapplet provides the option to export out the heat map image file along with supporting geo-referenced information in the form of world and projection files.

To run the Mapplet, click this link http://dominoc925-pages.appspot.com/mapplets/vheatmap.html.

The Mapplet's sidebar contains a few button commands that should be obvious - Import, Export, Fit and Clear.


Clicking the Import button brings up the Import Points dialog. 

Copy and paste your comma-separated-values data into the text box. The data must be comma delimited and in  the following order: latitude, longitude, and magnitude. Alternatively, click Use random samples to let the Mapplet randomly create CSV data for demonstration purposes. 

Then click Start Import to create the heat map. 

Click  the Export button to export the heat map and supporting files. This will bring up the Export Heatmap dialog box. 

To save out the heat map image, right click on the image preview and choose Save image as

Next, click on the World file text box and press +C to copy the contents to the clipboard. Then paste inside a text editor and save the world file with the same file name but with the prefix *.pgw. 

Similarly, click on the Projection text box and press +C. Then paste in a text editor and save the contents into a projection file with the same file name prefix but with the extension *.prj. 


Once the image, world file and projection have been exported, the heat map can be displayed and overlaid with other geo-spatial data in any GIS software e.g. Global Mapper as shown below. 


5 comments:

  1. Hi, great website, "it goes to the point".
    The Heatmap mapplet is not working for me (I'm behind a proxy) with IE v8 (it says that the browser cannot display heatmaps) neither Chrome v28 (I can paste my points but "Start Import" button does nothing, it doesn't even close Import Points dialog box).
    What could be wrong; would you mind helping me?
    Thank you!

    ReplyDelete
  2. Hi Lino
    It wasn't your problem, just that the heatmap library had some problem with the new browser versions. It's fixed now.

    ReplyDelete
  3. Hi Dominoc

    Thank you for the great tool. Though the magnitude dos not work for me. I have changed the values many time and the result is always the same

    Thanks for helping me out
    Sam

    ReplyDelete
  4. Hi Dominoc,

    Can you speak to the privacy of the information imported into the Google heat map Mapplet?

    Thanks!

    ReplyDelete
  5. Charles, the data is only loaded locally. The heatmap rendering is done entirely on your machine. So... the information is still private to you.

    ReplyDelete