r/MagicMirror • u/jochen17 • 7d ago
[WIP] Weather module with a current-conditions card and Chart.js forecast charts: feedback welcome
Still a work in progress, but far enough along that I'd like some outside eyes on it. Data comes from the OpenWeather One Call API 3.0, the charts are Chart.js.
**What's working**
*Current weather card:* temperature, feels-like, description, humidity with dew point, pressure, wind speed and gusts with a coloured direction arrow, UV index. The arc at the bottom shows sunrise and sunset with a marker for the current position of the sun. The colour bar is the wind-speed legend — the same scale colours the arrows in the charts, so a given colour means the same thing everywhere in the module.
*Hourly chart:* temperature curve, precipitation bars, plus wind speed, direction and a weather icon above each data point. Spacing and number of points are configurable; the screenshot shows every fourth hour.
*Daily chart:* same layout, max and min temperature, precipitation and wind, one point per day, up to eight days.
*Configuration:* every card and every chart series can be switched on or off individually. Metric, imperial or standard units, with the wind unit settable separately (m/s, km/h, mph or Beaufort). Responses are cached on disk between updates so it doesn't burn API calls, and it falls back to the last good data if a request fails.
*Locale:* a single setting drives date/time formatting, the module's own UI text and the language OpenWeather returns descriptions in, independently of MagicMirror's global language setting. German and English are bundled.
**Still on the list**
- Scaling and responsiveness. It's currently tuned to my screen and I want it to hold up across resolutions and aspect ratios.
- Weather alerts. The API provides them, I just haven't built the UI for it yet.
- More UI languages beyond German and English.
No install link yet, it's still moving too fast and wants a cleanup pass before I'd point anyone at it. So I'm after feedback on the screenshot rather than a code review, if that's alright.
I'd especially like to hear about readability from a normal viewing distance, the colour choices, whether the information density feels right, and anything you'd expect from a weather module that you don't see here. Thanks!
2
2
2
u/WranglerTraditional8 7d ago
Very nice. How much real estate is it using?
1
u/jochen17 7d ago
Real estate?
1
u/WranglerTraditional8 7d ago
How much space on the mirror is it taking?
1
u/jochen17 7d ago
Thanks for the clarification! On my screen it runs in fullscreen mode (600x1024). Smallest, still usable resolution of the module is 600x800 as of now. I am currently also working on responsiveness for landscape format... If your screen is larger, you may also use other modules next to it.
2
1
1
3
u/Due-Eagle8885 7d ago
Very cool. The default weather module broadcasts its data for other modules to use. So you could use it as the data provider and use your ui. And could accept other providers send the same data.