Custom Dark Sky Animated Weather Card

Share your Projects! Dashboards & Frontend
1297

I can’t seem to get the top margin to move down. Installed via HACS, on Home Assistant 0.117.1, and am using temp_top_margin: 5x (and/or, several different numbers/combinations), but to no avail. Any advice? My main temperature is all the way at the top of the card, with no margin.

1298

You can either edit the js file and the cs with an !important for some css variables OR use my fork which fixed that’s as well as some 0.117.0 quirks. My fork will work with your current unchanged config. Also some extra stuff if you read the docs. It’s the BOM card in HACS.

1299

Thanks for this info! I installed your card, but, unfortunately, have discovered new quirks that exist both in your fork, as well as in the original card from this thread. I am on Home Assistant version 0.117.1, and it seems, the small data is not updating, particularly the pressure, wind, and humidity. I discovered the error when another humidity gauge on my page had a different reading. Have you, or, anyone else noticed this?

1300

No I haven’t seen that. The card checks for changed state every 30 second and updates in my testing.

1301

Just watched the card right now and it updates within 30 seconds of the state changing.

1302

Capture I just tested again, and, note the humidity, it unfortunately didn’t change. The wind, precipitation forecast, among others, don’t seem to change either. I can confirm, the temperature, “feels like”, icons, and conditions, seem to change. I created a whole separate test Lovelace page, with nothing but these elements on it. I also removed any old Dark Sky versions that may potentially be causing conflict.

1303

mine definitely changes within 30 seconds (only checking wind/gust speed) The others don’t change much anyway so I can’t really catch them without waiting hours.

1304

I wonder if you have a caching issue… Did you use HACS? Can you press F12 and right click the refresh button and select empty cache and hard reload. Then CTRL+R a few times. Then see what happens.

1305

I completely removed everything, including the DOM, and dark sky versions. I seemed to have better luck with the manual install, vs. the HACS version. Then, I copied your full lovelace config from your git. For now, it seems like things are updating as they should. I will let you know if I run into trouble again. Thank-you for your time, and rapid responses.

1 Like
1306

Just be aware if you don’t use HACS you need to specify a version un the resources part (like in the old days) HACS stops caching of the js when you load an updated card…

1307

I have been trying to set the old_daily_format: to true, but it doesn’t seem to be changing from wind to current day low? Is anyone else having this issue?

1308

Hi everyone!

Do you know what I have to do to have my dark sky weather card show decimals with current temperature? I am using xiaomi sensor for that data and it does support decimals but card doesn’t.

Thank you

1309

My modification of this card optionally shows decimals

1310

great thank you - work well!

1 Like
1311

Hello, loving this card as opposed to the “original” custom animated weather card it can show temperature values of my actual sensor - and not just the entity.

One question though: As the weather integration I am using (dwd weather) doesn’t have forecast sensors for each day (the weather forecast somehow seems to be integrated into the weather entity) - I can’t use the forecast section of this card. The original one seems to be able to read the forecast from the weather entity.

So I would like to combine both worlds. Use the “current” section of this card and the forecast section of the original card. The original card has the option to only show forecast, current or details. However I don’t know how to achieve this with this version of the card.

Could you somehow help me to just show the “current” part of this card - e.g. by removing the forecast bit?

Thanks a lot guys!

1312

You should be able to use attributes of the weather entity for the forecast… you just need to parse through the correct attribute in the card config.

1313

Oh really this is possible? This would be awesome!!

Could you please explain to me how to do that? - I don’t have that much experience with configurating stuff and programming in general…

Best regards and thanks for the quick response!

1315

so this is now officially an issue for me :wink:

even after having updated the LitElement to Lit, as David has done in his BOM card, I cant make the card show. Balloob tuned in on Discord on the error I saw:

 updateValues() {
    const root = this.shadowRoot;
    if (root.childElementCount > 0)

advising me to do:

It calls updateValues too early

the shadowroot doesn’t exist yet
just guard it. if (this.shadowRoot) { this.updateValues(); }

so I changed to

  set hass(hass) {
    this._hass = hass;
    if (this.shadowRoot) { this.updateValues(); }
//     this.updateValues();
  }


// #####
// updateValues - Updates card values as changes happen in the hass object
// #####

  updateValues() {
    const root = this.shadowRoot;
    if (root.childElementCount > 0) {

etcetc

no more errors in the inspector. No card either though ;-(

Hope anyone here has more luck… please let me know if you do.

Update

well, what do you know: the card is back, automagic once again… Guess I’ll keep an eye on it

2 Likes
1316

Funny I never saw that error myself but I guess I need to make that other change as well

1317

@Mariusthvdb I’ve not been able to get it working even with your tweaked version. All I get is this error in the log:

https://[URL]/local/dark-sky-weather-card.js?track=true:709:14 Uncaught TypeError: Cannot read property ‘childElementCount’ of null