So I finally got around to investigate this some more and I finally found a solution.
Quick Recap: The Picture Elements documentation tells us that to use locally hosted image we have to use hosting.
However if we follow that advice the file is accesible for the whole internet without authentication!
I want to have a detailed 3D floor plan of my appartment in a picture elements card like the many awesome examples displayed in this thread. And call me crazy, but I don’t want you weirdos on the internet to easily get a good look at what I have inside my appartment
The solution is the local file camera integration.
-
Upload the image in media
-
Add a local file camera to your configuration.yaml and change file_path to to point to the image e.g.
camera:
- platform: local_file
file_path: /media/floor_plan.png
name: "Appartment"
- Restart Home Assistant
- Now in the picture elements card change image to “camera_image” and point into to your camera created in step 2 e.g.
type: picture-elements
elements:
- type: state-icon
entity: switch.1234_on_off
icon: mdi:lightbulb
tap_action:
action: toggle
style:
top: 50%
left: 50%
camera_image: camera.appartment
You now have your floor plan or image hosted in a way that only authenticated users can access the image file.
The “Local file” integration also allows us to easily update the camera image via Service local_file.update_file_path which opens up a whole lot of possibilities (e.g. have multiple images with time of day rendereing and update the camera every hour or so).
camera_image can also be used for image elements in the card.
Maybe someone else who minds their privacy like I do, will find this usefull.