Skip to content

Custom weather card with charts but using local icons

License

Notifications You must be signed in to change notification settings

mrchris82/weather-chart-card-custom

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Weather Chart Card

Buy me a coffee PayPal

hacs_badge GitHub release (latest by date) GitHub downloads GitHub release (latest by SemVer including pre-releases) HACS Validate

weather-chart-card 15-days

Installation

HACS

This card is available in HACS (Home Assistant Community Store). HACS is a third party community store and is not included in Home Assistant out of the box.

Configuration variables:

Card options
Name Type Default Description
type string Required Should be custom:weather-chart-card.
entity string Required An entity_id with the weather domain.
temp string none An entity_id for a custom temperature sensor.
press string none An entity_id for a custom pressure sensor.
humid string none An entity_id for a custom humidity sensor.
uv string none An entity_id for a custom UV index sensor.
winddir string none An entity_id for a custom wind bearing sensor. Sensor should have value in degrees
windspeed string none An entity_id for a custom wind speed sensor.
feels_like string none An entity_id for a custom feels like temperature sensor.
description string none An entity_id for a custom weather description sensor.
title string none Card title.
show_main boolean true Show or hide a section with current weather condition and temperature.
show_temperature boolean true Show or hide the current temperature.
show_current_condition boolean true Show or hide the current weather condition.
show_attributes boolean true Show or hide a section with attributes such as pressure, humidity, wind direction and speed, etc.
show_time boolean false Show or hide the current time on the card.
show_time_seconds boolean false Show or hide seconds for the current time on the card.
show_day boolean false Show or hide the current day on the card. (Only visible when show_time is true.)
show_date boolean false Show or hide the current date the card. (Only visible when show_time is true.)
show_humidity boolean true Show or hide humidity on the card.
show_pressure boolean true Show or hide pressure on the card.
show_wind_direction boolean true Show or hide wind_direction on the card.
show_wind_speed boolean true Show or hide wind_speed on the card.
show_feels_like boolean false Show or hide feels like temperature on the card.
show_description boolean false Show or hide the weather description on the card.
use_12hour_format boolean false Display time in 12-hour format (AM/PM) instead of 24-hour format.
icons string none Path to the location of custom icons in svg format, for example /local/weather-icons/.
animated_icons boolean false Enable the use of animated icons
icon_style string 'style1' Options are 'style1' and'style2' for different set of animated icons.
icons_size number 25 The size of the animated or custom icons in pixels.
current_temp_size number 28 The size of the current temperature in pixels.
time_size number 26 The size of the current time in pixels.
day_date_size number 15 The size of the current day and date in pixels.
forecast object none See forecast options for available options.
units object none See units of measurement for available options.
locale string none See Supported languages for available languages
Forecast options
Name Type Default Description
precipitation_type string rainfall Show precipitation in 'rainfall' or 'probability'.
show_probability boolean false Also show probability value when precipitation_type = rainfall. (Only when available)
labels_font_size number 11 Font size for temperature and precipitation labels.
precip_bar_size number 100 Adjusts the thickness of precipitation bars (1-100).
temperature1_color string rgba(255, 152, 0, 1.0) Temperature first line chart color.
temperature2_color string rgba(68, 115, 158, 1.0) Temperature second line chart color.
precipitation_color string rgba(132, 209, 253, 1.0) Precipitation bar chart color.
chart_datetime_color string primary-text-color Chart day or hour color
chart_text_color string none Chart text color
chart_height number 180 Adjust the forecast chart height
condition_icons boolean true Show or hide forecast condition icons.
show_wind_forecast boolean true Show or hide wind forecast on the card.
round_temp boolean false Option for rounding the forecast temperatures
style string style1 Change chart style, options: 'style1' or 'style2'
type string daily Show daily or hourly forecast if available, options: 'daily' or 'hourly'
number_of_forecasts number 0 Overrides the number of forecasts to display. Set to "0" for automatic mode.
Units of measurement
Name Type Default Description
pressure string none Convert to 'hPa' or 'mmHg' or 'inHg'
speed string none Convert to 'km/h' or 'm/s' or 'Bft' or 'mph'
What custom icons can I use?

Icons should be in svg format. Icons should have names as shown here. Example: 130360372-76d70c42-986c-46e3-b9b5-810f0317f94f

Example usage:

Card with current time, date and day

date-time

type: custom:weather-chart-card
entity: weather.weather_home
show_time: true
show_day: true
show_date: true
animated_icons: true
icon_style: style1
Style2 chart

style2

type: custom:weather-chart-card
entity: weather.my_home
forecast:
  style: style2
Chart only

Chart-only

type: custom:weather-chart-card
entity: weather.my_home
show_main: false
show_attributes: false
forecast:
  condition_icons: false
  show_wind_forecast: false
Custom units

Units

type: custom:weather-chart-card
entity: weather.my_home
units:
  pressure: mmHg
  speed: m/s
Supported languages:
Language Locale
Bulgarian bg
Catalan ca
Czech cs
Danish da
Dutch nl
English en
Finnish fi
French fr
German de
Greek el
Hungarian hu
Italian it
Lithuanian lt
Norwegian no
Polish pl
Portuguese pt
Romanian ro
Russian ru
Slovak sk
Spanish es
Swedish sv
Ukrainian uk

About

Custom weather card with charts but using local icons

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 100.0%