Same problem here. Don’t know how to solve it
Thx for this !
Could there be a possibility to set the forecast interval ? So not only hours, but days ?
I got this:
- type: 'custom:buien-rain-forecast'
long: 4.8945
lat: 52.3667
lineColor: 'rgba(89, 160, 238, 1)'
fillColor: 'rgba(89, 160, 238, 0.2)'
icon: 'mdi:weather-rainy'
style: |
ha-card {
border-radius: 10px;
box-shadow: 5;
overflow: hidden;
height: 100%;
}
Any idea what is wrong (it is placed in a horizontal stack) ?
Me too I have is as a separate card
Probably caused by the desktop issue mentioned above (works fine on Android).
Card doesn’t scale very well though 
Could there be a possibility to set the forecast interval ?
No, the provided data only covers a fixed time-interval in the future.
If you want to look ahead for days, try my solution: Buienalarm visuals in a Panel Iframe
Following, i have the same issue 
Preview works perfect.
The height of the canvas is set to 0.
Manual changing it to 300 px make the graph visible.
Hey all! Sorry have been a bit busy and not on the community lately. Can you guys tell me what version of hass.io you are running? (I havent updated past 0.108.3 yet).
0.109.6 (latest)
Same issue with 0.110.1. It sometimes shows a graph after refreshing the page, but most of the time, no graph…
Got the same issue when look on my laptop/dekstop.
But when looking on my mobile the graph shows properly.
Hey all taking a look into all of this. I will probably update the graph system. Side note: I also figured out how to scrape BuienAlarm (better forecast!). So im working on this too. Will keep you posted
2 Likes
I almost always see it being drawn, but then lovelace starts laying out the cards (on an old ipad with the homeassistant app, you can really see this happening) and then the graph disappears…
This looked like a nice component, but broken here as well
Fixed it by using a suggestion in one of the github issues:
- type: 'custom:buien-rain-forecast'
long: 4.8945
lat: 52.3667
lineColor: 'rgba(89, 160, 238, 1)'
fillColor: 'rgba(89, 160, 238, 0.2)'
update_interval: 10
icon: 'mdi:weather-rainy'
style: |
.chartjs-render-monitor {
height: 200px;
}
It may be you need something like card-mod. I have a couple of these custom components installed.
So how can I make this only appear under the condition there is indeed rain coming?
Is there also a possiblity to hide the time frames or make the amount of rain dynamic in height (so that if 0.3 falls the graphic doesn’t go up till 12 or something 
) t
thanks!
Hey everyone sorry for being off and on the community here - I don’t always get time to mess around with these things. I’m going to check what’s going on with the current card and fix the things mentioned here.
Im also looking at scraping data from buien alarm (I find their data to be more accurate). So will keep you all posted. Cheers!
2 Likes
Maybe it would be possible to provide just some sensors which we can feed into something like mini-graph. That makes more UI tweaking possible and less work for you?
1 Like
Sorry for not doing it the proper Github way (no time to study how it works currently), but I added a tweaked version as issue: https://github.com/lukevink/lovelace-buien-rain-card/issues/12
This version contains annotations (and the plugin included) to make it look more like buienalarm and I tried something else to scale the y-axis a bit better.
I installed using HACS and I can access the .js file from the browser correctly.
It does report “Custom element doesn’t exist: buien-rain-forecast” however.
What can I do to fix this?
One other thing I saw is that the description in hacs shows information about another plugin about a swiping function (no info about the buien-rain-forecast)