Interactive Hail Maps is please to offer free hail map widgets and plugins that allow you to create eye-catching hail maps for your own website.

If you have a WordPress website or blog, you can use our Hail Reports Heatmap WordPress Plugin.

Or, if you do not have a WordPress site,  get the widget code below, and plug it into any website! Here’s a sample:

Here’s the widget code for the Hail Report Heatmap Widget above: 


<iframe style="width: 100%; height: 620px;" src="https://maps.interactivehailmaps.com/plugin/hailheatmapwidget" frameborder="0" ></iframe>

Customize the Map

Show the Hail Reports Heatmap for any storm date / any city.

[raw]

The Hail Reports Heatmap can be customized to automatically zoom in to your city with a specific storm date.

Adjusting the Widget Height

[box style=”alert”]It is important to set the height of the widget based on the width of the containing page. Since the section above is showing the widget in full page width mode (no sidebars), the height has been set to 620px. If you are embedding the widget in a more narrow column (as we are with the widget to the right), adjust the height accordingly – 450px in this example.[/box]

Here’s the code for the above widget:


<iframe style="width: 100%; height: 450px;" src="https://maps.interactivehailmaps.com/plugin/hailheatmapwidget?initialdate=2012/4/28&zoomlevel=8&state=mo&city=saint+louis" frameborder="0" ></iframe>

[clear]
[/raw]

Parameters

  • initialdate=m/d/yyyy – Initialize the hail map with reports from the specified date.
  • state=mo – Initialize the map centered on the state / city specified. Both state and city must be specified together.
  • city=saint+louis – Use a plus sign for spaces within the city name.
  • zoomlevel=8 – Show the map zoomed in to the specified level. Range from 4 (outer most, less detail) to 10 (inner most, more detail). If not specified, defaults to 4 if no city/state is specified, or defaults to 8 if a city/state is specified. Hail markers show on zoom levels 9 and 10.
  • hidedatenavigator=yes – hides the three button date navigator in the header, and prevents the visitor from changing the map’s date.
  • hideheader=yes – hides the header bar above the map. The visitor will not be able to see or change the map date.
  • heatonly=yes – user this option and the map will not display the map markers – only the heatmap.