[HA] Custom Lovelace 날씨 및 실내공기상태 카드

준비물

Hass.io - Lovelace모드

---

 

안녕하세요 랜이입니다.

 

nKay님의 날씨카드를 보고 제 나름대로 customizing 한 날씨카드와

 

실내공기상태(온도,습도,CO2,미세먼지)를 이쁘게 표현하기 위해서 수정을 해보았습니다.

 

두개의 카드에 추가로 공통적으로 사용하는 컴포넌트가 있습니다.

skkang90 님의 SK Weather, AirKorea 컴포넌트 입니다.

 

 

1. 날씨카드

weather-card.zip

0.07MB

 

 

추가/수정한 점

- 일출/일몰시간 추가

- 최고/최저온도의 위치 변경

- 현재습도를 추가

- 현재온도/현재습도는 SK Weather에서 불러옵니다.(dark sky보다 sk weather가 더 정확합니다.)

- 풍향/풍속을 추가

- 기압을 추가

- 오존농도를 추가

- 대기점수(KHAI)를 추가

- 예보를 다시 5개로 변경

- 날씨업데이트 시간 추가

 

 

entity: weather.nalssi

name: 날씨

type: 'custom:weather-card'

 

 

2. 실내공기 상태 카드

aircondition-card.js

0.03MB

 

 

실내공기 카드는 제가 사용중인 센서에 맞추어 설정했습니다.

거실에 PMS7003 센서, CO2센서

안방에 어웨어 를 사용중입니다.

 

거실과 안방이 중요하다고 생각되어.. 아래와 같이 카드를 만들었습니다.

 

카드내용은 제일 상단에 평균온도/평균습도, 평균 이산화탄소 농도

 

아래쪽에 거실과 안방정보입니다.

해당부분은 js파일 보시고 본인 원하시는 정보로 수정하시면 될거같습니다.

 

아래쪽에는 각방의 온습도 정보를 나타냅니다.

show: true/false로 해당방의 정보를 보이게/안보이게 할수있습니다.

각방의 아이콘은 변경가능합니다.

 

모든방에서 show: false로 설정을 하면

실내 / 실외 동시비교 화면으로 바뀝니다.

 

data:

  - co2: sensor.co2

    humidity: sensor.0x00158d00023711f2_humidity

    icon: 'mdi:television-classic'

    pm10: sensor.pm10

    pm25: sensor.pm2_5

    room: 거실

    show: false

    temperature: sensor.0x00158d00023711f2_temperature

  - co2: sensor.awair_co2

    humidity: sensor.0x00158d000201886f_humidity

    icon: 'mdi:home-heart'

    pm25: sensor.awair_pm2_5

    room: 안방

    show: false

    temperature: sensor.0x00158d000201886f_temperature

    voc: sensor.awair_voc

  - humidity: sensor.0x00158d000201b73a_humidity

    icon: 'mdi:fire'

    room: 주방

    show: false

    temperature: sensor.0x00158d000201b73a_temperature

  - humidity: sensor.0x00158d00022728f7_humidity

    icon: 'mdi:desktop-classic'

    room: 서재

    show: false

    temperature: sensor.0x00158d00022728f7_temperature

  - humidity: sensor.0x00158d00022737ed_humidity

    icon: 'mdi:cat'

    room: 고양이방

    show: false

    temperature: sensor.0x00158d00022737ed_temperature

entity: weather.nalssi

type: 'custom:aircondition-card'

 

 

 

 

js 파일을 수정하실때는 v=1.0.0 에서 숫자를 올려서 새로고침 하시면 됩니다.

 

resources:

  - type: module

    url: /local/custom-lovelace/weather-card/weather-card.js?v=1.0.0

  - type: module

    url: /local/custom-lovelace/aircondition-card.js?v=1.0.0

 

 

이상입니다.

 

 

 

 

추가. 2019-05-27 기준

 

메인 대쉬보드

data:
  - co2: sensor.awair_co2_livingroom
    humidity: sensor.temp_livingroom_humidity
    icon: 'mdi:television-classic'
    pm25: sensor.awair_cpm2_5_livingroom
    room: 거실
    show: false
    temperature: sensor.temp_livingroom_temperature
    voc: sensor.awair_voc_livingroom
  - co2: sensor.awair_co2_bedroom
    humidity: sensor.temp_bedroom_humidity
    icon: 'mdi:home-heart'
    pm25: sensor.awair_pm2_5_bedroom
    room: 안방
    show: false
    temperature: sensor.temp_bedroom_temperature
    voc: sensor.awair_voc_bedroom
  - humidity: sensor.temp_kitchen_humidity
    icon: 'mdi:fire'
    room: 주방
    show: false
    temperature: sensor.temp_kitchen_temperature
  - humidity: sensor.temp_room1_humidity
    icon: 'mdi:desktop-classic'
    room: 서재
    show: false
    temperature: sensor.temp_room1_temperature
  - humidity: sensor.temp_room2_humidity
    icon: 'mdi:cat'
    room: 고양이방
    show: false
    temperature: sensor.temp_room2_temperature
entity: weather.nalssi
type: 'custom:aircondition-card'

 

모니터링 화면

data:
  - co2: sensor.awair_co2_livingroom
    humidity: sensor.temp_livingroom_humidity
    icon: 'mdi:television-classic'
    pm25: sensor.awair_pm2_5_livingroom
    room: 거실
    temperature: sensor.temp_livingroom_temperature
    voc: sensor.awair_voc_livingroom
  - co2: sensor.awair_co2_bedroom
    humidity: sensor.temp_bedroom_humidity
    icon: 'mdi:home-heart'
    pm25: sensor.awair_pm2_5_bedroom
    room: 안방
    temperature: sensor.temp_bedroom_temperature
    voc: sensor.awair_voc_bedroom
  - humidity: sensor.temp_kitchen_humidity
    icon: 'mdi:fire'
    room: 주방
    temperature: sensor.temp_kitchen_temperature
  - humidity: sensor.temp_room1_humidity
    icon: 'mdi:desktop-classic'
    room: 서재
    temperature: sensor.temp_room1_temperature
  - humidity: sensor.temp_room2_humidity
    icon: 'mdi:cat'
    room: 고양이방
    temperature: sensor.temp_room2_temperature
entity: weather.nalssi
type: 'custom:aircondition-card'