how can i get rid of all the extra sensors in “unused”? seems like all the attributes for all the other days.
You can’t so far as I know. I count 235 extra sensors and that was KILLING my recorder so I added them to the exclude list… now I have history again.
Thank you, that fixed it (along with making sure the spacing lined up properly).
It worked for me too. Thanks!
im new to this too and spent ages trying to get the template working until i found this thread so thankyou everyone
wrong thread, somehow
Have you been able to get this working ?
I have been trying today with no success
yes, works fine.
use this in the config:
temp_color: sensor.dark_sky_temp_color
create that template sensor:
# for use in custom dark-sky-weather-card.js
dark_sky_temp_color:
value_template: >
{% set temp = states('sensor.dark_sky_temperature')|float %}
{% if temp < -5 %} rgb(30, 255, 255)
{% elif temp < 0 %} rgb(30, 144, 255)
{% elif temp < 10 %} rgb(255, 255, 0)
{% elif temp < 15 %} rgb(255, 211, 30)
{% elif temp < 20 %} rgb(0, 128, 0)
{% else %} rgb(255, 165, 0)
{% endif %}
and use this in the card.js under style:
var temp_color = this.config.temp_color ? this._hass.states[this.config.temp_color].state : 'rgb(255, 165, 0)';
and in the css bit:
.temp {
font-weight: ${tempFontWeight};
font-size: ${tempFontSize};
color: ${temp_color};
position: absolute;
right: ${tempRightPos};
margin-top: ${tempTopMargin};
}
This is exactly what i tried all night
It fails to work for me
It is failing in my sensors.yaml file, i set it up like this
this is the error i get.
Im running it in HA 0.89.2 under Hassbian if it makes a difference
in the cards js i changed the color to temp_color
and added the style below the existing styles.
One thing I have noticed too,
When setting up the custom card,
HA seems to change the order of the lines of text in the card by itself
below is what the order of my card now looks like after HA has reordered the lines.
- title: Home
cards:- entity_forecast_high_temp_4: sensor.dark_sky_daytime_high_temperature_4
entity_visibility: sensor.dark_sky_visibility
entity_forecast_low_temp_1: sensor.dark_sky_overnight_low_temperature_0
entity_forecast_high_temp_5: sensor.dark_sky_daytime_high_temperature_5
tooltip_border_width: 3
entity_forecast_high_temp_3: sensor.dark_sky_daytime_high_temperature_3
tooltip_left_offset: -12
entity_summary_4: sensor.dark_sky_summary_4
entity_current_conditions: sensor.dark_sky_icon
entity_pop_5: sensor.dark_sky_precip_probability_5
entity_pop_3: sensor.dark_sky_precip_probability_3
entity_summary_5: sensor.dark_sky_summary_5
tooltip_bg_color: ‘rgb( 75,155,239)’
entity_humidity: sensor.dark_sky_humidity
entity_pop_intensity: sensor.dark_sky_precip_intensity
entity_forecast_high_temp_2: sensor.dark_sky_daytime_high_temperature_2
temp_color: sensor.dark_sky_temp_color
entity_forecast_low_temp_5: sensor.dark_sky_overnight_low_temperature_4
entity_forecast_low_temp_3: sensor.dark_sky_overnight_low_temperature_2
entity_summary_1: sensor.dark_sky_summary_1
entity_pop_4: sensor.dark_sky_precip_probability_4
entity_forecast_icon_3: sensor.dark_sky_icon_3
entity_forecast_icon_4: sensor.dark_sky_icon_4
entity_pop_2: sensor.dark_sky_precip_probability_2
entity_forecast_icon_1: sensor.dark_sky_icon_1
entity_summary_2: sensor.dark_sky_summary_2
entity_daytime_high: sensor.dark_sky_daytime_high_temperature_0
type: ‘custom:dark-sky-weather-card’
entity_pressure: sensor.dark_sky_pressure
entity_temperature: sensor.dark_sky_temperature
entity_pop: sensor.dark_sky_precip_probability
entity_forecast_icon_5: sensor.dark_sky_icon_5
entity_summary_3: sensor.dark_sky_summary_3
entity_wind_speed: sensor.dark_sky_wind_speed
entity_current_text: sensor.dark_sky_current_text
alt_wind: sensor.dark_sky_alt_wind
entity_daily_summary: sensor.dark_sky_daily_summary
tooltip_fg_color: ‘#fff’
entity_forecast_low_temp_2: sensor.dark_sky_overnight_low_temperature_1
entity_apparent_temp: sensor.dark_sky_apparent_temperature
entity_pop_1: sensor.dark_sky_precip_probability_1
entity_wind_bearing: sensor.dark_sky_wind_bearing
tooltip_border_color: orange
entity_forecast_low_temp_4: sensor.dark_sky_overnight_low_temperature_3
entity_forecast_icon_2: sensor.dark_sky_icon_2
tooltip_width: 100
tooltip_caret_size: 10
entity_forecast_high_temp_1: sensor.dark_sky_daytime_high_temperature_1
tooltips: true
entity_sun: sun.sun - title: Switch
type: entities
entities:- switch.standard_2
- switch.leftside_2
- switch.tvlight_2
- switch.rightside_2
- switch.tvplug_2
- title: Light
type: entities
entities:- light.lounge
- light.glass
- light.back
- light.backroom
- light.bathroom
- entity_forecast_high_temp_4: sensor.dark_sky_daytime_high_temperature_4
Ohhh it was a real PICNIC
i missed the - after the > in the value_template line
got it working now thankyou :))
I managed to make the card more compact and I’m fairly happy with the way it’s looking now:
Please share your code…
I think I’ve included all relevant changes here:
.card {
margin: auto;
padding-top: 5em;
padding-bottom: 3em;
padding-left: 1em;
padding-right:1em;
position: relative;
background: url(/local/lovelace/home/weather.jpg);
}
.temp {
font-weight: ${tempFontWeight};
font-size: ${tempFontSize};
color: var(--primary-text-color);
position: absolute;
left: 2.6em;
margin-top: ${tempTopMargin};
}
.tempc {
font-weight: ${tempFontWeight};
font-size: 1.5em;
vertical-align: super;
color: var(--primary-text-color);
position: absolute;
left: 10em;
margin-top: ${tempUOMTopMargin};
}
.variations {
display: flex;
flex-flow: row wrap;
font-weight: 300;
color: var(--primary-text-color);
list-style: none;
position: absolute;
top: 1.7em;
right: 2.8em;
}
ul.variations > li > li {
padding: 0.5em;
font-weight: bold;
font-size: 12px;
}
.unit {
font-size: 0.8em;
}
.forecast {
width: 100%;
margin: 6em auto;
height: 2em;
}
.icon.bigger {
width: 10em;
height: 10em;
margin-top: ${largeIconTopMargin};
position: absolute;
left: 1.5em;
}
#daily-summary-text {
margin-left: 1em;
}
Full text block for those who want to straight copy & paste:
return html`
.clear {
clear: both;
}
.card {
margin: auto;
padding-top: 5em;
padding-bottom: 3em;
padding-left: 1em;
padding-right:1em;
position: relative;
background: url(/local/lovelace/home/weather.jpg);
}
.ha-icon {
height: 18px;
margin-right: 5px;
color: var(--paper-item-icon-color);
}
.line {
margin-top: ${separatorTopMargin};
margin-left: 1em;
margin-right: 1em;
}
.temp {
font-weight: ${tempFontWeight};
font-size: ${tempFontSize};
color: var(--primary-text-color);
position: absolute;
left: 2.6em;
margin-top: ${tempTopMargin};
}
.tempc {
font-weight: ${tempFontWeight};
font-size: 1.5em;
vertical-align: super;
color: var(--primary-text-color);
position: absolute;
left: 10em;
margin-top: ${tempUOMTopMargin};
}
.apparent {
color: var(--primary-text-color);
position: absolute;
right: ${apparentRightPos};
margin-top: ${apparentTopMargin};
margin-right: ${apparentRightMargin};
}
.currentText {
font-size: ${currentTextFontSize};
color: var(--secondary-text-color);
position: absolute;
left: ${currentTextLeftPos};
margin-top: ${currentTextTopMargin};
}
.pop {
font-weight: 400;
color: var(--primary-text-color);
}
.variations {
display: flex;
flex-flow: row wrap;
font-weight: 300;
color: var(--primary-text-color);
list-style: none;
position: absolute;
top: 1.7em;
right: 2.8em;
}
ul.variations > li > li {
padding: 0.5em;
font-weight: bold;
font-size: 12px;
}
.unit {
font-size: 0.8em;
}
.forecast {
width: 100%;
margin: 6em auto;
height: 2em;
}
.day {
display: block;
width: 20%;
float: left;
text-align: center;
color: var(--primary-text-color);
border-right: .1em solid #d9d9d9;
line-height: 1.5;
box-sizing: border-box;
margin-top: 1em;
}
.dayname {
text-transform: uppercase;
}
.forecast .day:first-child {
margin-left: 20;
}
.forecast .day:nth-last-child(1) {
border-right: none;
margin-right: 0;
}
.highTemp {
font-weight: bold;
}
.lowTemp {
color: var(--secondary-text-color);
}
.icon.bigger {
width: 10em;
height: 10em;
margin-top: ${largeIconTopMargin};
position: absolute;
left: 1.5em;
}
.icon {
width: 50px;
height: 50px;
margin-right: 5px;
display: inline-block;
vertical-align: middle;
background-size: contain;
background-position: center center;
background-repeat: no-repeat;
text-indent: -9999px;
}
.weather {
font-weight: 300;
font-size: 1.5em;
color: var(--primary-text-color);
text-align: left;
position: absolute;
top: -0.5em;
left: 6em;
word-wrap: break-word;
width: 30%;
}
.fcasttooltip {
position: relative;
display: inline-block;
}
#daily-summary-text {
margin-left: 1em;
}
.fcasttooltip .fcasttooltiptext {
visibility: hidden;
width: ${tooltipWidth}px;
background-color: ${tooltipBGColor};
color: ${tooltipFGColor};
text-align: center;
border-radius: 6px;
border-style: solid;
border-color: ${tooltipBorderColor};
border-width: ${tooltipBorderWidth}px;
padding: 5px 0;
/* Position the tooltip */
position: absolute;
z-index: 1;
bottom: 50%;
left: 0%;
margin-left: ${tooltipLeftOffset}px;
}
.fcasttooltip .fcasttooltiptext:after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -${tooltipCaretSize}px;
border-width: ${tooltipCaretSize}px;
border-style: solid;
border-color: ${tooltipBorderColor} transparent transparent transparent;
}
.fcasttooltip:hover .fcasttooltiptext {
visibility: ${tooltipVisible};
}
`
}
Another question guys, Im still learning
I want to use this weathercard in 2 seperate views,
One for my home location and one for my holiday location
I understand by default it takes the gps coordinates from the default home longitude and latitude, This can be overriden by providing the coordinates in the darksky platform configuration.
How can it be overriden at runtime ? so when looking at my home location view it uses the home coordinates and when looking at the holiday location view it uses the coordinates of that location instead ?
I think you would need 2 differently named sensors & 2 different cards.
That would double the number of darksky requests though so you might need to adjust the polling to not exceed the free tier of usage.
The dark sky sensor (singular) pulls all the data in one request and creates hundreds of sensors if you configure everything (yes hundreds), But you can display the data on as many cards as you like and it’s only one API call per interval.
I would of thought there may be a way to update the request for the longitude and latitude prior to each poll depending on the view you are currently looking at ?
From a technical perspective, that would involve changing the Home Assistant configuration and restarting Home Assistant.