Add a meteogram to your sitemap

Tutorials & Examples
,
1

I like meteograms for weather forecasts - I think they’re great to get the most information at a glance.

I’ve been looking into services which provide them and found two, so just thought I’d share my findings:

meteograms.com

I just made an HABPanel widget for this one, but if you want it in a sitemap, just right click on the image and copy its URL to include it in your sitemap. They can be a little slow to render though, but you can customize them extensively.

yr.no

This great service from Norway which I found very accurate offers meteograms as SVG or PNG files. Just search for a location and you’ll arrive to a page with an URL in the format place/(country)/(region or state)/(city) like this: https://www.yr.no/place/United_States/District_of_Columbia/Washington_D.C_/

Then, just append meteogram.png to the URL and you’ll get this image:

meteogram.png
meteogram.png828×272

You can also append advanced_meteogram.png to get a more detailed meteogram with cloud cover and pressure:

advanced_meteogram.png
advanced_meteogram.png828×302

Note: the SVG versions are at meteogram.svg and advanced_meteogram.svg respectively, but they can’t be displayed in sitemaps.

AFAIK you can’t customize the 48-hour forecast or the layout.

Example snippet to include in sitemaps

  Frame label=Meteogram {
    Image url="https://www.yr.no/place/United_States/District_of_Columbia/Washington_D.C_/meteogram.png" label="Meteogram" refresh=3600000
  }
7 Likes
2

This is brilliant - thank you.

3

I’ve looked through the settings document and the settings gallery, but cannot find an answer. Does anyone know if there’s a setting to use freedom units (aka imperial - Fahrenheit/mph)?

4

This example has temperatures in °F and wind speeds in mph:

Looking at the attached JSON (https://trello-attachments.s3.amazonaws.com/55b9cbc60372879b15d71751/571f19ec072991d2a5f6889f/c86fbbd07f0e7f18f15c6c0a757bcdea/1515840e3a16c8c1259711424ad487bc7caa4029.json) that would be:

provider: "wunderground.com",
temperatureUnit: "fahrenheit",
windSpeedUnit: "mph",

(Note the provider - the default one, met.no, probably only supports celsius and metric)

You have a link on the Trello board above to import this design into their website.

5

Thank’s for the tip, I am going to use it with other meteo sites as well.

Shouldn’t be this “3600000”?

6

Shouldn’t be this “3600000”?

Yes :slight_smile:

7

That’s it! Thank you.