Generic Camera, Weather meteogram - transparency/invertion possible?

Configuration
1

Hi all,

Anybody know if I can get this ‘inverted’ / transparent for dark background?

This is the current code used:

camera:
  - platform: generic
    name: Weather
    still_image_url: https://www.yr.no/place/Norway/Oslo/Oslo/Oslo/meteogram.svg
    content_type: 'image/svg+xml'

image
image2917×998 485 KB

2

I suggest you switch to using Meteogram instead of YR. Meteogram is highly configurable when it comes to looks, and you can still even use YR as the weather source.

3

I have looked for the answer to this and found it using mod-card and this

camera:
- platform: generic
  name: "Yr.no Ingebäck"
  still_image_url: https://www.yr.no/place/Sverige/V%C3%A4stra_G%C3%B6taland/Ingeb%C3%A4ck/advanced_meteogram.png
  framerate: 0.0008

  - type: picture-entity
    entity: camera.yr_no_ingeback
    hold_action:
      action: none
    camera_image: camera.yr_no_ingeback
    show_state: false
    show_name: false
    style: |
   :host {
        filter: invert(1) hue-rotate(180deg);;
      }

Screenshot 2021-01-02 at 20.30.01
Screenshot 2021-01-02 at 20.30.011102×404 123 KB

3 Likes
4

Please note about the answer above, that the camera is defined in the configuration.yaml and the picture-entity within a container of a lovelace card. So for me defining a vertical-stack card like this worked:

type: vertical-stack
cards:
  - type: picture-entity
    entity: camera.meteogram
    hold_action:
      action: none
    show_state: false
    show_name: false
    card_mod:
      style: |
        :host {
          filter: invert(1) hue-rotate(180deg);
        }

The URL scheme of yr.no has changed and can be found like this: Did you use our old widgets? - Yr