Iframe and picture card

Share your Projects! Dashboards & Frontend
1

Hello!
I am trying to use lovelace and i get trouble with frontend of hassio.

There is my config and how it looks like:
cards:

iframe%20picture
iframe%20picture507×831 82.7 KB

I am getting these images from: http://www.meteo.pl/um/php/meteorogram_id_um.php?ntype=0u&id=606

I would like to make this card without any scrolls (scale it down somehow?) and these diagram legend be like this link above, the same dimensions. How to make it? Any solutions? Scale manualy this diagram legend down?

Ty in advance.

2

Why dont you just use a “Picture card”
Or set the picure as a camera sensor

3

Picture Card is what I currently use for Meteo using Camera component and Generic platform to acquire the image.

configuration.yaml:

camera:
  - platform: generic
    name: Weather
    still_image_url: <your www.meteo.pl url>
    content_type: <See camera component Generic Camera>

and lovelace:

  - type: picture-entity
    name: Meteogram for xxxx
    entity: camera.weather
    camera_image: camera.weather
    tap_action:
      action: more-info

Tap on the picture and it enlarges.
The only drawback is there is a gray transparent bar at the bottom of the image that also shows a state of the camera.

4

you can remove the state https://www.home-assistant.io/lovelace/picture-entity/#show_state

5

Ah thanks for that!..and if both show_state and show_name are false, no gray transparent bar at all.

1 Like
6

I dont know what a

  content_type: <See camera component Generic Camera>

should i set up, Could you give me a hint? I need only these 2 images with meteogram and meteogram legend. Can u help me?

7

Take a look…

and this

I think your pictures are png, so try

content_type: ‘image/png’

8

I already tried it and it is not working :frowning: Any ideas?

9

The following worked for me

camera:
  - platform: generic
    name: Weather
    still_image_url: 'http://www.meteo.pl/um/metco/mgram_pict.php?ntype=0u&fdate=2019020218&row=458&col=225&lang=pl'
    content_type: 'image/png'

Lovelace:

  - type: picture-entity
    name: Weather (Picture Entity)
    entity: camera.weather
    camera_image: camera.weather
    show_info: true
   #tap_action: dialog
    tap_action:
      action: more-info
10

That is working but u need to look at the structure of link which is not the same day after day.

still_image_url:
http://www.meteo.pl/um/metco/mgram_pict.php?ntype=0u&fdate=**20190202**18&row=458&col=225&lang=pl

That means link changes everyday like days :frowning: For example if u type 01 instead 02 it will shows different image. We need sth smarter :frowning: