Add an active Weather Radar Map

Is there a way to animate the image that’s grabbed using this method? All I’ve got is a still when I use this technique. Also, I’ve noticed that if I change the link from _WKR_PRECIPET_SNOW.gif to _WKR_COMP_PRECIPET_SNOW.gif I get a little more detail, but it also shows the circles for radar range; do you know a file naming convention or other way to choose which ovelays are included on the image? Ideally I’d like to find a way to imbed the 10-frame animate image with the city names and roads overlay enabled.

I’ve created a camera component that returns an animated image, the details are at this thread:

The COMP image is a fall-back that is used when the actual site requested is not available. It uses surrounding radars (where available) to try to build a composite image that covers the target area.

I haven’t figured out a way to add the overlays; they don’t seem to publish them.
Let me know if you have any more questions.

This was working beautifully until very recently- perhaps after the 0.93.1 HA upgrade. As shown I have both wunderground and NOAA in there; about 60% of the time for wunderground and 100% of the time for NOAA I’m getting the broken link icon, and the camera shows “idle”. No related errors in the log. I tried playing around with content_type but it didn’t really seem to change anything. Has anyone else noticed a change?

Config:

camera:
  - platform: generic
    still_image_url: 'https://icons.wxug.com/data/weather-maps/radar/united-states/binghamton-new-york-region-current-radar-animation.gif'
    name: 'ny_radar'
#    content_type: image/gif
#    scan_interval: 60
  - platform: generic
    still_image_url: 'https://radar.weather.gov/Conus/full_loop.php'
    name: 'us_radar'

Lovelace:

cards:
  - entity: camera.ny_radar
    type: picture-entity
  - entity: camera.us_radar
    type: picture-entity

One more thing… tried adding an Iframe card, which works, but it only displays the upper left hand corner of the weather map. There doesn’t seem to be any control over scale.

Yea, I am getting the broken icon quite often as well. This morning it has been that way all morning and I tried to go to the URL itself, and that too failed to open. I would venture to guess this is more of an issue with weather underground than HA.

FWIW, I went back through the instructions and the URL is quite different now. I wonder if they changed something on their side. Using the new URL, its at least working at the moment.

Considering that there is now a free, feature-rich API of rainviewer.com available here, would it make sense (is it possible?) to integrate this as an optional overlay on the “normal” map?
As e.g. seen here, I suppose this may be relatively easy to add to the existing leaflet/openstreetmap code? If so, I think it should also be possible to adjust the colormap of the radar image with respect to the used theme.

1 Like

I’m using an embedded page from windy.com of my area on iframe card.

I’m using an embedded page from windy.com of my area on iframe card.

I tried this in an iframe:

type: iframe
aspect_ratio: 100%
url: 'https://www.windy.com/?43.207,-79.228,8,m:eRVadWQ'

but it gives a “refused to connect” error :frowning:

Any advice?

are you accessing HA over http://ip-address:8123? If you are that’s the problem. You can’t run a https iFrame when using http.

are you accessing HA over http://ip-address:8123? If you are that’s the problem. You can’t run a https iFrame when using http.

Thanks! i did not know that.

But i tried through my nabucasa URL as well and got the same results

https://dont-post-this-bit.ui.nabu.casa/lovelace/weather

You should ask nabu-casa (and delete your url!) about that - I don’t think it supports that.
I use a http image:

camera:
  - platform: generic
    name: BOM Satellite
    still_image_url: http://www.bom.gov.au/gms/IDE00135.jpg

But it’s a ‘camera’
Lovelace displays it:

      - type: vertical-stack
        cards:
          - type: picture-entity
            title: BOM Satellite
            entity: camera.bom_satellite
            tap_action:
              action: more-info
            hold_action:
              action: more-info

image

Maybe you can do similar?

1 Like

Hi Dave thanks for helping me - and for your constant help with others on this forum, it hasn’t gone unnoticed.

I tried your suggestion - it probably would have worked but i could not find a Canadian provider that produces still images of the radar like BOM does.

Try your local news channel’s website. That’s what I do because I liked the look and it’s a familiar image for the family. I’m In the States, but thought you might have luck this way if you haven’t tried it yet.

Terry

1 Like

The BOM one was an example… did you try that windy.com URL in the camera?

1 Like

Thanks David, i ended up using the windy.com url in an iframe.

It looks quite good!

1 Like

Hi. Phillip, would you mind posting the config piece showing this? I’m still having trouble getting the Windy URL to work.
Thank you!

I got it to work, finally. I was getting an error that Windy.com would not allow the page to open…
What I wound up doing was clicking in the menu on Windy to “Embed Widget on page”.
Its pretty slick, as its fully functional in terms or animating the map and zoom controls etc.

3 Likes

I’m on mobile rn. So hopefully this screenshot helps

It does indeed. Thanks very much!!!