Weather Widget Question

Apps & Services HABPanel
1

I’m just getting starting this week in finally learning some on Habpanel…

Thanks to Signal11, I have a great base to start with and have started with the weather widget.

But I can’t get the icons to show. I could have sworn they were there yesterday and today there missing. And the widget shows the Temps, Humidity, and Pressure correct. Just no images.

I have them located in /etc/openhab2/html/images

and I also have them in /etc/openhab2/html/weather-data/images

So where to they belong? When I try to follow an image link it takes me to

http://myipaddress:8080/static/images/colorful/null.png

I think maybe it could something else with the weather binding? If I add a ‘null’ image to my /html/images/colorful/ folder, that will show up. Yet the images are not showing the various forecasts, etc.

Maybe something with the ConditionID?

EDIT, Found the issue if helps anyone. I had add the " unit=fahrenheit" to the Item info, and seems that results in looking for a null image.

String   Weather_Condition0       "Condition [%s]"      {weather="locationId=home, forecast=0, type=condition, property=text, unit=fahrenheit"}

So in your Condition0, 1, 2, you shouldn’t identify a unit value.

2

Hello,

Edit: I missed the last line, where you already solved it. I will leave this wall of text here, as it may be helpful to issues other than what you had :slight_smile: )

I got the icons from the thread for Template Example: Weather Binding. At the top of that thread, it shows where to extract the files.

In my example, I am using the ‘colorful’ icon set I believe. After you extract the files, you should have /etc/openhab2/html/images directory, with several subdirectories for colorful, dark, flat_white, etc. So if you want to use the colorful icons, you will need an /etc/openhab2/html/images/colorful directory.

The problems that I had are related to the fact that the image file used is based on the name of the weather condition. The names that come from your weather binding have to match the names of the files. In the original thread, it used the following code:

<img src="{{ServerPath}}/images/{{IconSet}}/{{itemValue('Condition1').replace(' ','-') | lowercase }}.png"/>

The replace(’ ‘,’-’) stuff would change it so that if the condition was “partly cloudy” it would use the string “partly-cloudy”. That worked fine, except I found on my system when I had conditions with multiple spaces, it didn’t work correctly. (“chance of rain” became “chance-of rain”) I changed the code, which should be in my json, to use:

<img src="{{ServerPath}}/images/{{IconSet}}/{{itemValue('Weather_Condition1').split(' ').join('-') | lowercase }}.png"/>

The split and join seemed to work really well. That covered most of the problems, but I still had issues when the weather condition did not have a corresponding file. The icon set is good, but since it uses the names for the conditions, those names will change slightly based on which weather binding you use. I am using weather underground for my binding, which worked most of the time. If I got a broken image link, I would look at the name of the weather condition, and make sure a file existed to cover that condition.

For example, when I got a condition for “chance of a thunderstorm”, it showed a broken image link, as there is no “chance-of-a-thunderstorm.png” file. I copied an existing icon with a different name to cover the exact text of the condition I was missing. In that case, I think I used the cloudy icon, but you could use whatever one makes sense to you.

3

Hi

I have a little trouble finding the right icon. I have added weather icon flat_white but I miss some icons that are not there.

chance-of-a-thunderstorm.png
chance-of-rain.png
and some more

Is there a complete set of icons that I can use?