A suggestion would be to try it using Inkscape.
Another way (perhaps a horrible way) would be to edit the colors by hand directly in the svg file.
The svg file is a text file so any text editor should allow you to edit the file and save it.
Colors are usually found with fill=xxxx which would fill in a particular shape object with color xxxx or stroke =yyyy which would color a line object with color yyyy. xxxx/yyyy can be something like "orange" or "#C6DEFF"
1 Like
I just installed the card from the HACS repository and itâs working great on desktop Chrome. However, I donât see the animated icons on mobile chrome, only the static ones like wind speed. Did I do something wrong?
I have almost the inverse of dantist. I had the custom weather card installed with HACS with the animated icons, but I kept getting high resource usage complaints from Chrome and Safari. I installed the static icons by creating a folder under /local/community/weather-card/static-icons, but it looks like the latest weather-card update via HACS wiped my static-icons folder. Thatâs no biggie. I just re-downloaded them and placed them in a different folder outside of the community folder. I was just curious, though, if that is expected behavior. Does HACS wipe the containing folder and replace with the new version?
I keep seeing this error in my logbook:
Tried to serve up â/config/www/community/weather-card/icons/undefined.svgâ but it does not exist.
I downloaded the complete animated icon pack but undifind.svg is not in it.
What can i do to fix this error?
so one of your sensors has an undefined state which is why itâs looking for that icon. You need to create a dummy undefined.svg file. Where are you in the world?
Ok i can do that. Maybe the weather sensor is not always receiving all information.
I also have this error from my weather:
Data element with key=âvisibilityâ not loaded from br data!
But that is because the weather location i use doesnât measures the visibility, so it is not send.
since this got liked recently, please note the windkracht customization can be shortened to:
sensor.windkracht:
icon: mdi:weather-windy
templates:
icon_color: >
var bft = entities['sensor.wind_bft'].state;
var mapper = {'0':'rgb(239,213,194)',
'1':'rgb(204,163,154)',
'2':'rgb(0,195,255)',
'3':'rgb(47,23,231)',
'4':'rgb(77,255,90)',
'5':'rgb(0,207,36)',
'6':'rgb(245,255,0)',
'7':'rgb(255,186,0)',
'8':'rgb(255,78,98)',
'9':'rgb(255,0,0)',
'10':'rgb(140,60,0)',
'11':'rgb(126, 0, 0)'}
return mapper[bft] ? mapper[bft] : 'rgb(0,0,0)';
I use custom weather card.
How to change the display of the current temperature to the temperature from my own sensor. I tried to edit the JS-file, but it did not give a positive result
I received strange error for weather-card:
anybody else?
Thanks for your awesome fork, I find it really useful that one can choose what conditions to monitor. Would it be possible to add the perception under each day? Like the fork ha-weather-card-extended has done 
Unfortunately, I have atm no time for smart home. Nevertheless, Iâll provide a little instruction for you to fork the card.
In the dist folder, youâll find the weather-card.js file - this is what you have to edit. First, pass the additional two variables to the card config in your lvoelace yaml. Youâll recognize the pattern, that the sensors are called XY_2h XY_4h etc. We do not pass all the single sensors, instead weâll want to add the _2h etc later in the card and pass only the common part of the sensor name(s), i.e see temperature.:
Next, youâll need to append the new sensor to the internal state object of the card which starts at line 101. Put it into the forecast and today object based on the pattern for temperature.
Finally, you want to display the new values. In line 285 and 310 the forcast and today values are rendered. Here, you can add it based on the pattern in row 298 to 300. If you need additional css classes, append them in row 385.
hi, did you get this resolved ? i am getting same error and running latest version 0.107.7 thanks
Iâm trying to squeeze a small, 4-day forecast into a horizontal stack (thatâs all the space left I have in my wall control panel). Can anybody tell me how to modify the code to eliminate the vertical bars? Also, Iâm getting 4 days by just hiding the overflowing 5th day through card-mod. Is there a way to just reduce the size of the whole card proportionally when added to a horizontal-stack?
Not the best news, API will last till the end of 2021 but no new API signups:
Now that really sucks!
Agree 1000% this screws many people over not just HA but home weather stations too. Apple sucks!!!
1 Like
I just updated hassio to .109 and lost my lovelace.yaml configuration. I copied my raw ui-lovelace.yaml file onto the clipboard then went to the raw lovelace editor and pasted over the generated file and got everything back excepted the custom animated weather card. In my configuration section I have a resource that points to the .js file (/local/custom_ui/dark-sky-weather-card.js?v=7.1). In the raw lovelace editor I have (type: âcustom:dark-sky-weather-cardâ) defined. Nothing shows up under my Weather heading.
Any help would be appreciated.