Buy me a coffee to support my work on this lovelace card

This is a weather card that works with Hong Kong Observatory ONLY

This card is a modification of a fork of DavidFW1960/bom-weather-card

This card provides MANY additional features as well as compatability with later versions of home assistant. New features:

• Lit 3
• Only use Day time icons for forecast for future days (days 1-5)
• More icons
• Adds Locale customisation for number formats
• Added to card-picker in Lovelace
• Added option to show minimum or maximum first in forecast
• Added option to show 1 decimal place to temperatures, apparent temperature, todays max/min, and pressure
• Show rainfall as an intensity or absolute number
• Removed leading zeros if 12hr time
• Added Wind Gust
• Can use different icon sets
• Added extra (8th) row of slots
• Added slots (optional) for UV ratings
• Added possibility of rainfall to forecast
• Added Warning Icon and Info
• Added Tropical Cyclone Warning Icon

The Weather Card provides current and forecast weather conditions using HA sensors. You configure the card by passing in sensor entities from the weather component.

The card is very customizable. You can configure many aspects of it's look and feel as well as which specific content to show by passing in customization flags and defining optional sensors. Content can also be rearranged if desired.

Hovering over a forecast day will display the daily weather summary in a tooltip popup if that option has been enabled.

Add this repo https://github.com/aes-alienrip/hko-weather-card

Install card from HACS as per other plugins. Note that you must add this card as a module to the resources section as per the instructions when you install the card.

homeassistant:
  packages: !include_dir_named www/community/hko-weather-card/sensor/zh

homeassistant:
  packages: !include_dir_named www/community/hko-weather-card/sensor/en

└── ...
└── configuration.yaml
└── www
    └── community
        └── hko-weather-card
            └── sensor
		└── en
     		     └── input_select_en.yaml
     		     └── rest_en.yaml
     		     └── template_en.yaml
		└── zh
     		     └── input_select.yaml
     		     └── rest.yaml
     		     └── template.yaml
            └── weather_icons
		└── animated
		└── static
            └── hko-weather-card.js
            └── hko-weather-card.js.gz

Installation is done. You must still configure the yaml manually.

1. Load new YAML configurations in Quick reload

2. Select your nearby Weather Station (Temperature, Humidity, Pressure, Wind, Rainfall / Rainfall_en) from Input Select helper
   Developer Tools -> STATES -> Entity -> Search for "input_select.hko"
   
   

3. Add the card definition: You can add this card from the card picker but need to configure the entities and flags in YAML. There are required / optional and flag entries. This card has been added to the custom-card-picker in Lovelace

An example configuration is in lovelace.yaml - this can be pasted into the manual card configuration in the GUI editor If you paste it in the raw editor or in a yaml file, take care with the indenting.

Required entries must be present in your configuration. The card will not work at all if any of these lines are missing.

type: custom:hko-weather-card
locale: zh-hk
time_format: locale
refresh_interval: 30
static_icons: false
tooltips: true
show_separator: true
hide_slot_section: false
hide_forecast_section: false
hide_summary_section: false
show_decimals: false
show_decimals_apparent: false
show_decimals_today: true
show_decimals_pressure: false
use_old_column_format: true
entity_sun: sun.sun
entity_warnsum: sensor.hko_warnsum
entity_warninginfo: sensor.hko_warninginfo
entity_temperature: sensor.hko_temperature
entity_apparent_temp: sensor.hko_apparent_temp
entity_daytime_high: sensor.hko_temperature_max
entity_daytime_low: sensor.hko_temperature_min
entity_humidity: sensor.hko_humidity
entity_wind_bearing: sensor.hko_wind_bearing
entity_wind_speed: sensor.hko_wind_speed
entity_wind_gust: sensor.hko_wind_gust
entity_uv_alert_summary: sensor.hko_uvindex
entity_pressure: sensor.hko_pressure
entity_rain_today: sensor.hko_rainfall
entity_current_conditions: sensor.hko_forecast_icon
entity_forecast_icon_1: sensor.hko_forecast_icon_0
entity_forecast_icon_2: sensor.hko_forecast_icon_1
entity_forecast_icon_3: sensor.hko_forecast_icon_2
entity_forecast_icon_4: sensor.hko_forecast_icon_3
entity_forecast_icon_5: sensor.hko_forecast_icon_4
entity_forecast_low_temp_1: sensor.hko_forecast_min_temp_0
entity_forecast_low_temp_2: sensor.hko_forecast_min_temp_1
entity_forecast_low_temp_3: sensor.hko_forecast_min_temp_2
entity_forecast_low_temp_4: sensor.hko_forecast_min_temp_3
entity_forecast_low_temp_5: sensor.hko_forecast_min_temp_4
entity_forecast_high_temp_1: sensor.hko_forecast_max_temp_0
entity_forecast_high_temp_2: sensor.hko_forecast_max_temp_1
entity_forecast_high_temp_3: sensor.hko_forecast_max_temp_2
entity_forecast_high_temp_4: sensor.hko_forecast_max_temp_3
entity_forecast_high_temp_5: sensor.hko_forecast_max_temp_4
entity_daily_summary: sensor.hko_forecast_summary
entity_summary_1: sensor.hko_forecast_summary_0
entity_summary_2: sensor.hko_forecast_summary_1
entity_summary_3: sensor.hko_forecast_summary_2
entity_summary_4: sensor.hko_forecast_summary_3
entity_summary_5: sensor.hko_forecast_summary_4
entity_forecast_high_rh_1: sensor.hko_forecast_max_rh_0
entity_forecast_high_rh_2: sensor.hko_forecast_max_rh_1
entity_forecast_high_rh_3: sensor.hko_forecast_max_rh_2
entity_forecast_high_rh_4: sensor.hko_forecast_max_rh_3
entity_forecast_high_rh_5: sensor.hko_forecast_max_rh_4
entity_forecast_low_rh_1: sensor.hko_forecast_min_rh_0
entity_forecast_low_rh_2: sensor.hko_forecast_min_rh_1
entity_forecast_low_rh_3: sensor.hko_forecast_min_rh_2
entity_forecast_low_rh_4: sensor.hko_forecast_min_rh_3
entity_forecast_low_rh_5: sensor.hko_forecast_min_rh_4
entity_pop_1: sensor.hko_forecast_psr_0
entity_pop_2: sensor.hko_forecast_psr_1
entity_pop_3: sensor.hko_forecast_psr_2
entity_pop_4: sensor.hko_forecast_psr_3
entity_pop_5: sensor.hko_forecast_psr_4

locale: en
static_icons: false
tooltip_bg_color: 'rgb( 75,155,239)'
tooltip_border_color: orange
tooltip_border_width: 3
tooltip_caret_size: 10
tooltip_fg_color: '#fff'
tooltip_left_offset: -12
tooltip_width: 100
tooltips: true
old_daily_format: false
time_format: 24
show_beaufort: true
show_decimals: false

The current condition columns are specified by 'slots'. There are 8 left column slots (designated l1 - l8) and 8 right column slots (designated r1 - r8). There are currently 16 possible values that can be assigned to a slot. These are:

• daytime_high
• daytime_low
• maxmin_since_midnight (max and min temperature since midnight)
• rainfall (Rainfall in the past hour from automatic weather station)
• wind
• visibility
• sun_next (the next sun event ... sunset or sunrise)
• sun_following (The following sun event ... if sun_next is a sunset then this will be the following sunrise and vice versa)
• pop (probability of precipitation) Shows % possible rainfall today and the actual recorded rainfall
• popforecast Shows % possible rainfall today and forecast rainfall
• humidity
• pressure
• uv_summary
• possible_today (possible rainfall today)
• custom1 - custom8 (populates using config fields custom1_icon - custom8_icon, custom1_value - custom8_value and custom1_units - custom8_units)
• empty (empty slot... the slot below does not rise to fill the space)
• remove (same as empty but the slot below rises to take the place of the slot)

If configuring with Slots please ensure to fill all available positions, the slots that you do not need can be filled with "remove" to ensure that they remain blank.

1. Card is splitted into 4 sections : Main, Slot, Forecast and Summary
2. Main section with current condition, text, temperature and topbar (apparent temp and warning icon) cannot hide
3. Example flags for the minimal card as below

show_separator: false
hide_slot_section: true
hide_forecast_section: true
hide_summary_section: true