Weather API's (Changing Again!)

Slowly getting to improve my new weather page.

Still needs tweaking of course but I also need to add the forecast data. I'm currently using OWM. Unfortunately, OWM not doing a good job of understanding the wind. Currently showing <1m/s but most of the time it is currently nearer the gust speed, around 12m/s.

Both the wind and temperature boxes now have coloured backgrounds that change according to the weather. I've used the following to set the colors:

For wind, using the Beaufort scale

Temperature Color Scale - borrowed from windy.com

  • Deep Blue (hsl(240, 80%, 60%)) - Very Cold: < -10°C
  • Blue (hsl(220, 70%, 70%)) - Cold: -10°C to 0°C
  • Light Blue (hsl(200, 60%, 75%)) - Cool: 0°C to 10°C
  • Green (hsl(120, 50%, 70%)) - Mild: 10°C to 20°C
  • Yellow (hsl(60, 80%, 70%)) - Warm: 20°C to 30°C
  • Orange (hsl(30, 85%, 65%)) - Hot: 30°C to 40°C
  • Red (hsl(0, 80%, 70%)) - Very Hot: > 40°C

I've used the Windy.com app for a while now, especially for the weather radar which has proved very useful.

The radar map predicts the radar image up to 1 hour ahead, so we can predict local rain/storms with some certainty. It would be great if that data could trigger an alert, something like ā€˜17mm/h rain likely in 15 minutes’.

I don't know if windy has a API…

While the OWM wind prediction wasn't very accurate earlier, the minutely precipitation forecast WAS accurate. So I've added that to my weather page as it might actually be useful.

Yes, I didn't quite get the chart ready before teatime so I missed the rain. The chart is an accumulating 60 minute forecast of rain in mm.

I am trying out a new (to me) charting library from ObservableHQ, simply called Plot. It builds over D3. Seems quite nice to work with so far, well supported by AI coding it seems and very well documented.

Website, Docs, GitHub, Examples

2 Likes

Just looking at Plot… yes, loads of options, and nice clean looking layouts.

The Plot gallery page is really helpful, as it has interactive examples which enable users to experiment on styles etc. Also nice that it show input data format, so easy to follow.

Nice find @TotallyInformation

1 Like

Windy does have an API. And you can also write plugins for it, which may let you do extra stuff, though I’ve never tried it… Introduction | Windy Plugins Guide

I think you have to have the paid version to install or use plugins but I may be mistaken.

1 Like

I have settled (for the moment) with weatherapi.com .. which give me all the info I need via the API call.. and very accurate for my location. I had the compass-view in DB1 but never got the time to setup for DB2, I realized I dont miss it :wink: (much)

But yes, maybe it is time to extend the view with hourly forecast and a new compass view :melting_face: .. I think next weekend is booked.

2 Likes

Improved precipitation chart. Auto-scales, shows the text "No precipitation in the next hour" if none is forecast. Has cross hairs and display's the current hovered point.

I'd like to put some colour on the chart to indicate levels of excessive precipitation. I may add a bar overlay to show the actual precipitation as well as the cumulative.

Loving the fact that GitHub Copilot can make sense of the Plot API, making it easy to produce quite complex charts easily. I can share code if anyone wants it.


Update:

Getting ever nicer.


We've got the current weather summary along with the matching icon. And the precipitation chart shows per-minute expected precipitation. In addition, the current minute is shown (and updated each minute). Also the cumulative chart has some light colour banding to indicate possible excessive rain levels.

@xx_Nexus_xx Great looking design… which icons are you using for your page?

the ā€œWeather-Icon..e.g. SUNā€ is provided by weatherapi as part of response

the Moon-phase icon, I have downloaded from Nasa website

the small icons are MDI icons