If it matters, I am running ZoneMinder to manage all of my ip cams. Is it possible to show a video feed ON the floorplan? I want to set up a hidden layer for each of my cams and when you click on a button, the feed becomes visible. I know I can have it pop up in another window, but I would rather have it actually show up as a part of the floorplan.
@atomicpapa Hi there. Yep, there is a new version of floorplan almost ready. It allows you to add cameras, that is, snaphsots of the live camera feeds. The floorplan code doesnât do any polling, but rather, it refreshes the camera image whenever the camera entityâsâs image URL changes in HA. Will have more info in the next few daysâŚ
6 Likes
For any brave âfloorplannersâ out there, feel free to try the new version (v1.0.7), which is currently in its own branch on GitHub. You just need to update the one file:
To get your camera images showing in the floorplan, simply create a <rect> (of the desired size) in your SVG for each camera you want to display. As always, make sure the <rect> IDs in the SVG match up with the entity IDs of your cameras in HA. For example:
<rect id="camera.driveway" width="60" height="40" x="10" y="10" />
Then, in your floorplan config, simply create a new group for your camera images, and add your cameras to that group:
- name: Camera Images
entities:
- camera.backyard
- camera.driveway
camera_image_template: '${entity.attributes.entity_picture}'
Let me know it goes!
2 Likes
That is awesome. Heading there to add it RIGHT NOW!
I think we have a WINNER!
And, yes, we are a 2 minivan family 
4 Likes
@atomicpapa Excellent. Is everything else working on your floorplan? Just want to make sure this version doesnât introduce any regression issues.
Just ran a quick click-thru on everything and got weird looks and questions (âDad, why did the hall light just turn on and off? Did you break something?â) from the kids and wife as to why lights were turning on and off throughout the house, so I would say it was a success.
1 Like
@atomicpapa Thanks for checking that. Will let this settle for a few days, and then this version can be pushed to the main branch and become the official release.
BTW, there is another feature in the new version I should also mention. You can now display a single HA entity in multiple places on your floorplan. This allows you to, for example, expose a single camera in the following ways:
- as text to display the current state (i.e. âidleâ)
- as an icon to show where the camera is mounted on your house
- as an image to show the live camera feed
Up until now, Floorplan has assumed a 1-to-1 mapping of your HA entities to their SVG elements, matching them using their entity IDs.
This still works, and nothing has changed in this regard. The difference now is that you can use the floorplan config to override which SVG element should be tied to your HA entity. For example, my driveway camera is shown twice on my floorplan, as shown by the red boxes below:
To get this working, below is what my floorplan config looks like. As you can see, my driveway camera appears in two different groups. The first group displays the camera as a small icon. The second group displays the camera as an image snapshot. The second group shows how you can override the SVG element that the camera should be tied to, in this case, it will look for <rect id="camera.driveway.image"> in the SVG file.
- name: Cameras
entities:
- camera.driveway
- camera.front_door
- camera.backyard
states:
- state: 'idle'
class: 'camera-idle'
- name: Camera Images
entities:
- entity: camera.driveway
element: camera.driveway.image
camera_image_template: '${entity.attributes.entity_picture}'
6 Likes
I wish I had known that before I changed all the names to dummy names on the cams I already had set up! LOL
1 Like
For the âmultiple placesâ entities, I really like that feature. Now I can remove my fake templates I used to duplicate some switches 
For the camera images, with my setup it works fine in Google Crome, works but throws an error in Safari (MacOs and iOS 11): TypeError: undefined is not an object (evaluating 'Object.keys(list)')
Iâm having problem displaying my camera image on floorplan.
Copied the linked ha-floorplan.html and followed the example:
- name: Camera Images
entities:
- camera.backyard
- camera.driveway
camera_image_template: â${entity.attributes.entity_picture}â
With my cameras, android_ip_webcam and amcrest, the is still clickable to show image, not showing image.
Do I need to create generic camera for this to work with my cameras?
I have to say, floorplan gives a whole new dimension to home-assistant, excellent work!!
@pkozul, somehow canât get this to work. Updated html to 1.0.7.4.
This was added to floorplan.yaml:
entities:
- camera.backside
- camera.kitchen
- camera.pool
- camera.entrance
- camera.bale
states:
- state: 'Idle'
class: 'camera-idle'
- state: 'Streaming'
class: 'camera-stream'
- state: 'Recording'
class: 'camera-record'
- name: Camera Images
entities:
- entity: camera.backside
element: camera.backside.image
- entity: camera.kitchen
element: camera.kitchen.image
- entity: camera.pool
element: camera.pool.image
- entity: camera.entrance
element: camera.entrance.image
- entity: camera.bale
element: camera.bale.image
camera_image_template: '${entity.attributes.entity_picture}'
Images are added to .svg as follows:
style="opacity:0.8;fill:#a05a2c;fill-opacity:1;stroke-width:1.11199784"
id="camera.bale.image"
width="152.00002"
height="102.17587"
x="248"
y="167.82414"
ry="4.8367276"
inkscape:label="#rect1027" />
Error messages in floorplan warnings are:
Cannot find â[object Object]â in HA group configuration
Am I missing something?
Managed to use mjpeg platform for my cameras and the corresponding .image element is now showing as a snaphot picture in the and can be click to pop-up live camera stream.
That snapshot picture is updated every time the floorplan panel is started/re-visited/reloaded though.
Is it how it supposed to work? Just snapshot and not live video?
Also, that snapshot wonât show in iphone, not even the corresponding .
I can live video stream via camera url as background on the floorplan panel for all my cameras, but the Amcrest only shows up on iphone.
1 Like
is it so now?
And, does this work with all camera implementations or just a selected fews. Canât get this to work with the Synology camera component so farâŚ
How did you manage to make dublicate switches using this feature?
Sorry, I procrastinated until I got new Sonoffs so no need to duplicate entities anymore.
I am attempting to get this working for media_players. I have the following floorplan
the xxâs should show the media title, but the test one I did only shows âplayingâ. Clicking on the icon for the google home/mini or Chromecast will pop up the window to pause/play, control volume, etc. and it works as intended In my .yaml config I have the following:
- name: Playing Now
entities:
- entity: media_player.gorgon
element: media_player.gorgon.media_title
media_player_template: '${entity.attributes.media_title}'
What did I screw up? lol
Same problem here. The image get just updated when reloading floorplan. The image shows up in chrome on my computer, but not on my Samsung phone.
How do you live stream using url as background on floorplan?