HomeAssistant仪表盘全屋3D俯视图的制作方法

• 作者:猫说网
• 来自:gdzzz.com
• 热度:

今天教大家HomeAssistant的仪表盘如何创建一个整屋3D图，按房间灯光效果的全景仪表盘。
就是你想哪里亮灯，就可以直接点击，并在俯视图里展示出灯光实时状态效果。
首先你得建立有一个自己家庭的格局3D效果图，可以通过酷家乐(闲鱼上面有人付费帮做这种图)这个软件对自己家庭格局进行创建，然后导出一个最终的俯视图即可。
当然，前提你得自己会PS基本技能，否则很难做到完美。
1、酷家乐导出你的房子俯视图之后，你需要通过ps将你每个房间单独做一个亮灯效果，这时候需要抠图，例如我们需要A房间亮灯，那么你需要单独选取A房间，然后右键羽化25%，然后ctrl+J创建一个新的图层，并将这个图层单独保存为一个png图片。必须是png透明的，如图效果：
这样就是可以方便你单独开这个区域灯光时，可以单独显示亮灯效果，以此类推，不同房间同样方法的建立一个独立的png图片。
2、然后打开HomeAssistant概览页面，右上角三个点，点击编辑仪表盘，然后创建一个新的卡片，选择图片类型。然后这个时候我们需要自己编程写代码，将每个设备单独独立调节出来。
代码如下：
type: picture-elements
image: /local/home/bg.jpg
elements:
  - type: image
    entity: switch.lumi_n3acn3_a25_left_switch_service
    state_image:
      'on': /local/home/sf-2.png
      'off': /local/home/bg.jpg
    style:
      top: 50%
      left: 50%
      width: 100%
      pointer-events: none
      mix-blend-mode: lighten
  - type: state-icon
    entity: switch.lumi_n3acn3_a25_left_switch_service
    icon: mdi:lightbulb-on-60
    state_color: true
    tap_action:
      action: toggle
    style:
      top: 24%
      left: 76%
      width: 100%

代码说明：大家可以复制我的代码，并自己修改一些图片路径。
'on': 是你的开灯效果图，也就是我们上面所说的png独立房间图。
'off':是你的关灯效果图，可以通用，就是我们的背景图。
entity: 就是你的设备id，就是例如你需要控制这个开关的id号，可以同设备列表里获取：



- type: state-icon 就是你的开关灯按钮小图标，你需要自己定义它在图片里的问题，
top就是上下位置，left就是左右位置，也就是开头图片里的蓝色小灯泡图标了。

多个房间，所以需要多个图标来控制不同的房间灯光，所以代码可以复制多个使用，
例如多个  - type: image  并单独多个   - type: state-icon 来定义每个房间的灯光。
如下图，就是多个灯光，我就复制多个代码进行增加，并调节各自不同的图标位置即可。设备id也得重新独立修改。


这样就是仪表盘俯视图的基本制作方法，建议会一点编程基础和ps技术的朋友可以折腾一下。
如果你是技术白痴，那么这里就建议还是放弃吧。