Ha-card-weather-conditions setup with ClimaCell/Tomorrow.io Integration

Tags: #<Tag:0x00007fc413f5a328> #<Tag:0x00007fc413f5a260>

For some time I used the brilliant original ClimaCell integration available via HACS from Renato Rossi. I found it to be very useful for local forecasts as well as air pollution and pollen. It’s got animated icon’s and very easy to configure/tweak. The out of the box Weather card didn’t work or do it justice to the card, so I use the ha-card-weather-conditions card by Renato and hukoeth GitHub - r-renato/ha-card-weather-conditions: Weather condition card (Lovelace) for Home Assistant..

Renato’s integration was put into competition with the native climacell integration introduced in 2021.3.
That integration now works well with the tomorrow.io v4 API and so I decided to transition to the native integration which is python based and seemingly having a longer future.

The problem is the lovelace card ha-card-weather-conditions didn’t talk to the new integration. So this guide is to share how I mapped things back to the card and restored the great card to it’s rightful position on my dashboard.

The new integration uses the standard weather entity so I had to map that back to variables that the card could use. Here’s how I did it:

In configuration.yml:

# For adding Pollen:

  - platform: template
    sensors:
      cc_grass_pollen_index_mod:
        friendly_name: Pollen Grass climacell
        icon_template: 'mdi:flower'
        value_template: >-
          {% if is_state('sensor.climacell_grass_pollen_index', 'none') %}
            0
          {% elif is_state('sensor.climacell_grass_pollen_index','very_low') %}
            1
          {% elif is_state('sensor.climacell_grass_pollen_index','low') %}
            2
          {% elif is_state('sensor.climacell_grass_pollen_index','medium') %}
            3
          {% elif is_state('sensor.climacell_grass_pollen_index','high') %}
            4
          {% elif is_state('sensor.climacell_grass_pollen_index','very_high') %}
            5
          {% else %}
            Unknown
          {% endif %}

 
      cc_tree_pollen_index_mod:
        friendly_name: Pollen Tree climacell
        icon_template: 'mdi:tree'
        value_template: >-
          {% if is_state('sensor.climacell_tree_pollen_index', 'none') %}
            0
          {% elif is_state('sensor.climacell_tree_pollen_index','very_low') %}
            1
          {% elif is_state('sensor.climacell_tree_pollen_index','low') %}
            2
          {% elif is_state('sensor.climacell_tree_pollen_index','medium') %}
            3
          {% elif is_state('sensor.climacell_tree_pollen_index','high') %}
            4
          {% elif is_state('sensor.climacell_tree_pollen_index','very_high') %}
            5
          {% else %}
            Unknown
          {% endif %}
          

      cc_weed_pollen_index_mod:
        friendly_name: Pollen Weed climacell
        icon_template: 'mdi:sprout'
        value_template: >-
          {% if is_state('sensor.climacell_weed_pollen_index', 'none') %}
            0
          {% elif is_state('sensor.climacell_weed_pollen_index','very_low') %}
            1
          {% elif is_state('sensor.climacell_weed_pollen_index','low') %}
            2
          {% elif is_state('sensor.climacell_weed_pollen_index','medium') %}
            3
          {% elif is_state('sensor.climacell_weed_pollen_index','high') %}
            4
          {% elif is_state('sensor.climacell_weed_pollen_index','very_high') %}
            5
          {% else %}
            Unknown
          {% endif %}

For the others sensors this worked fine:

template:
  - sensor:
      - name: cc_temperature 
        state: "{{ state_attr('weather.climacell_daily','temperature') }}"
        unit_of_measurement: °F
      - name: cc_humidity 
        state: "{{ state_attr('weather.climacell_daily','humidity') }}"

      - name: cc_pressure 
        state: "{{ state_attr('weather.climacell_daily','pressure') }}"
        unit_of_measurement: Hg        
 
      - name: cc_current_conditions
        state: "{{ states.weather.climacell_daily.state }}"

#        feels_like

      - name: cc_visibility
        state: "{{ state_attr('weather.climacell_daily','visibility') }}"

      - name: cc_wind_bearing 
        state: "{{ state_attr('weather.climacell_daily','wind_bearing') }}"
     
      - name: cc_wind_speed
        state: "{{ state_attr('weather.climacell_daily','wind_speed') }}"

      - name: cc_O3
        state: "{{ state_attr('weather.climacell_daily','ozone') }}"
        
      - name: cc_weather_condition_0d
        state: "{{ state_attr('weather.climacell_daily','forecast')[0].condition  }}"
      - name: cc_weather_condition_1d
        state: "{{ state_attr('weather.climacell_daily','forecast')[1].condition }}"
      - name: cc_weather_condition_2d
        state: "{{ state_attr('weather.climacell_daily','forecast')[2].condition }}"
      - name: cc_weather_condition_3d
        state: "{{ state_attr('weather.climacell_daily','forecast')[3].condition  }}"
      - name: cc_weather_condition_4d
        state: "{{ state_attr('weather.climacell_daily','forecast')[4].condition  }}"

      - name: cc_temperature_maximum_0d
        state: "{{ state_attr('weather.climacell_daily','forecast')[0].temperature }}"
        unit_of_measurement: °F
      - name: cc_temperature_maximum_1d
        state: "{{ state_attr('weather.climacell_daily','forecast')[1].temperature }}"
        unit_of_measurement: °F
      - name: cc_temperature_maximum_2d
        state: "{{ state_attr('weather.climacell_daily','forecast')[2].temperature }}"
        unit_of_measurement: °F
      - name: cc_temperature_maximum_3d
        state: "{{ state_attr('weather.climacell_daily','forecast')[3].temperature }}"
        unit_of_measurement: °F
      - name: cc_temperature_maximum_4d
        state: "{{ state_attr('weather.climacell_daily','forecast')[4].temperature }}"
        unit_of_measurement: °F
        
      - name: cc_temperature_minimum_0d
        state: "{{ state_attr('weather.climacell_daily','forecast')[0].templow }}"
        unit_of_measurement: °F
      - name: cc_temperature_minimum_1d
        state: "{{ state_attr('weather.climacell_daily','forecast')[1].templow }}"
        unit_of_measurement: °F        
      - name: cc_temperature_minimum_2d
        state: "{{ state_attr('weather.climacell_daily','forecast')[2].templow }}"
        unit_of_measurement: °F
      - name: cc_temperature_minimum_3d
        state: "{{ state_attr('weather.climacell_daily','forecast')[3].templow }}"
        unit_of_measurement: °F
      - name: cc_temperature_minimum_4d
        state: "{{ state_attr('weather.climacell_daily','forecast')[4].templow }}"
        unit_of_measurement: °F

      - name: cc_precipitation_intensity_0d
        state: "{{ state_attr('weather.climacell_daily','forecast')[0].precipitation }}"

      - name: cc_precipitation_probability_0d
        state: "{{ state_attr('weather.climacell_daily','forecast')[0].precipitation_probability }}"
 
      - name: cc_precipitation_probability_1d
        state: "{{ state_attr('weather.climacell_daily','forecast')[1].precipitation_probability }}"
 
      - name: cc_precipitation_probability_2d
        state: "{{ state_attr('weather.climacell_daily','forecast')[2].precipitation_probability }}"
 
      - name: cc_precipitation_probability_3d
        state: "{{ state_attr('weather.climacell_daily','forecast')[3].precipitation_probability }}"

      - name: cc_precipitation_probability_4d
        state: "{{ state_attr('weather.climacell_daily','forecast')[4].precipitation_probability }}"

This established the sensors that I needed to then populate the card as follows:
I created a manual card and you can paste this in and make sure the variables match above (or your naming scheme:

type: custom:ha-card-weather-conditions
name: Allen, TX
language: en
animation: true
pollen:
  weed:
    entity: sensor.cc_weed_pollen_index_mod
    min: 0
    max: 5
    low: 1
    high: 3
  grass:
    entity: sensor.cc_grass_pollen_index_mod
    min: 0
    max: 5
    low: 1
    high: 3
  tree:
    entity: sensor.cc_tree_pollen_index_mod
    min: 0
    max: 5
    low: 1
    high: 3
weather:
  icons_model: climacell
  current:
    sun: sun.sun
    moon_phase: sensor.moon
    current_conditions: sensor.cc_current_conditions
    temperature: sensor.cc_temperature
    humidity: sensor.cc_humidity
    pressure: sensor.cc_pressure
    visibility: sensor.cc_visibility
    wind_bearing: sensor.cc_wind_bearing
    wind_speed: sensor.cc_wind_speed
    forecast: true
  forecast:
    temperature_high:
      day_1: sensor.cc_temperature_maximum_0d
      day_2: sensor.cc_temperature_maximum_1d
      day_3: sensor.cc_temperature_maximum_2d
      day_4: sensor.cc_temperature_maximum_3d
      day_5: sensor.cc_temperature_maximum_4d
    temperature_low:
      day_1: sensor.cc_temperature_minimum_0d
      day_2: sensor.cc_temperature_minimum_1d
      day_3: sensor.cc_temperature_minimum_2d
      day_4: sensor.cc_temperature_minimum_3d
      day_5: sensor.cc_temperature_minimum_4d
    precipitation_probability:
      day_1: sensor.cc_precipitation_probability_0d
      day_2: sensor.cc_precipitation_probability_1d
      day_3: sensor.cc_precipitation_probability_2d
      day_4: sensor.cc_precipitation_probability_3d
      day_5: sensor.cc_precipitation_probability_4d
    precipitation_intensity:
      day_1: sensor.cc_precipitation_intensity_0d
air_quality:
  o3: sensor.cc_o3
  pm25: sensor.climacell_particulate_matter_2_5_mm
  pm10: sensor.climacell_particulate_matter_10_mm
  no2: sensor.climacell_nitrogen_dioxide
  co: sensor.climacell_carbon_monoxide
  so2: sensor.climacell_sulfur_dioxide
  epa_aqi: sensor.climacell_us_epa_air_quality_index
  epa_health_concern: sensor.climacell_us_epa_health_concern

I’m not using the China weather or fire sensor but you should be able to model that from the above. We don’t have access to the Feels Like values as they aren’t provided now by the integration - maybe in the future?!

Good luck and thanks Renato/all. As always contribute a more elegant solution if you have one!

4 Likes

Looks sweet. I was thinking about a weather page on my dashboard anyway. This looks good, will implement this, thanks for sharing

1 Like

had to change it to: very_low, guess it’s the same for very_high

1 Like

Hmm. I didn’t see the problem manifest so thanks for the call out; I’ll be changing mine. I updated the code above as well. Great catch.

1 Like