Lovelace: Weather card with chart

sergio_pt · September 21, 2020, 12:31pm

Hi Silicon_Avatar,

Yes, mentioned above by me. And issue reported by me as well
However, I noticed that there are two similar cards.

The one with the issue fixed is:
https://github.com/Yevgenium/lovelace-weather-card-chart

And I am looking for the fix in:
https://github.com/bobzer/weather-card

I also opened an issue on this different branch. I tried applying the same fix, but the code is different and it didn’t work.

Silicon_Avatar · September 21, 2020, 12:35pm

Sorry, I havent had my coffee yet.

I’ll try and take a look at that one tonight to see why the original fix doesnt work for it.

sergio_pt · September 21, 2020, 12:37pm

Thanks mate

bussio · September 22, 2020, 2:57pm

I have exchanged the modified *.js file … unfortunately this does not solve the problem. The chart is still not displayed …

yan · September 22, 2020, 6:03pm

I renamed the other file in that directory and that solved my problem

bussio · September 22, 2020, 7:11pm

You are right … this is how it works. Thanks for the info!

moelito · September 25, 2020, 12:01pm

Now I’m not following. I’m using https://github.com/bobzer/weather-card as @sergio_pt. The other one, https://github.com/bobzer/weather-card is fixed but not the one I use.
Did you solve the issue in https://github.com/bobzer/weather-card?

moelito · October 5, 2020, 3:41pm

Hi Again,
I’m sure it’s been asked before and maybe already answered but I didn’t find any answer.
This is a bit frustrating. I had an SD-card failure and my last snapshot was over a year old so I lost my configs where I had the custom weather card working. Now when re-engineering the configs I don’t manage to get the custom card working. Get the famous “Custom element doesn’t exist: weather-card-chart.”.

Config:

resources:
  - url: '/hacsfiles/lovelace-weather-card-chart/weather-card-chart.js'
    type: module

...
- type: 'custom:weather-card-chart'
  title: Weather
  weather: weather.smhi_home

What is going on?
Note: I added the repo as a custom repo

in HACS and installed the weather card chart from there.

Any help is highly appreciated.

SOLVED: Found the answer, keep my post if someone else have the same issue even though it’s been answered before…
The resources section has moved from the ui-lovelace.yaml to the configuration.yaml:-)
Strange that my old config worked before the SD-card breakdown though.

scstraus · October 7, 2020, 12:26pm

I also have the fix from the .27 version, cleared caches and did refresh from … menu, but still no graphs on .115.5… :-(. I went and manually verified that I had the same changes included in PR#43, and I do… But no graph…

Silicon_Avatar · October 8, 2020, 12:02am

If you’re using nginx (or another proxy) see if you have caching content enabled there. I did on mine, and it took me a while to see that this was the reason it wasnt working even after the changes and cache clearing on my local browser.

You can also try accessing it via the local IP (and not the URL) since this should bypass the proxy server, and see if it’s still broken.

scstraus · October 12, 2020, 1:14pm

No proxy, already accessing with local IP… also tried via Nabu Casa. It’s not working on any of 5 devices running 3 OSes and combination of local and remote URL. I even tried it on a brand new computer with a browser that had never connected to my dashboard before.

Actually I just noticed that it does actually work for my daily card using open weather map, but not my hourly card using dark sky. Must be something either with the daily view or dark sky.

- type: 'custom:weather-card-chart'
    title: Weather Today
    weather: weather.openweathermap
    sun: sun.sun
    mode: hourly

  - type: 'custom:weather-card-chart'
    title: Weather This Week
    weather: weather.weather_forecast
    sun: sun.sun

scstraus · October 18, 2020, 8:03pm

I am getting this error in the logs, maybe related to the above… Anyone have an idea why?

Logger: frontend.js.latest.202010012
Source: components/system_log/__init__.py:193
First occurred: 9:58:24 PM (19 occurrences)
Last logged: 9:58:41 PM
http://10.10.10.20:8123/hacsfiles/lovelace-weather-card-chart/weather-card-chart.js:298:43 Uncaught TypeError: Cannot read property 'forecast' of undefined

nvonbenken · October 27, 2020, 4:52am

I’m running into the Custom element doesn't exist: weather-card-chart. error some other users have found. I’m probably overlooking something small but I just can’t figure out what it is. I have the js file from the repo in my config/www folder.

configuration.yaml:

lovelace:
  resources:
    - type: module
      url: /local/weather-card-chart.js

ui-lovelace.yaml:

title: Home
views:
  - title: Test
    path: test
    badges: []
    cards:
      - type: 'custom:weather-card-chart'
        title: Weather
        weather: weather.openweathermap

scstraus · November 6, 2020, 8:48pm

Hi all, has anyone gotten the rain bar chart to show on an hourly forecast using Dark Sky? I’m just not a good enough programmer to figure out why this isn’t working.

Silicon_Avatar · November 6, 2020, 9:22pm

I’m using DarkSky still and it’s working fine for me.

scstraus · November 6, 2020, 9:44pm

Yean but that’s the card for a whole week, mine is for a single day. Mine works for a whole week too, but not for just a day with the hourly forecast.

Sirke · December 15, 2020, 1:10pm

I have a problem when I agree the card:

type: ‘custom:weather-card’
entity: weather.openweathermap

I’m using openweathermap and dafault card woking ok

cdikland · December 15, 2020, 2:19pm

Having the exact same issue and cant find an answer anywhere.

pigotka · January 9, 2021, 5:27pm

Made it work again. Just fixed the card config.

York_Yu_Chan · February 9, 2021, 8:28am

Hello I like your weather chard, can you share your js file?