Below is an alternative to showing the Weather HTML layout used in the Weather 1.x binding as a PNG image for use in a sitemap versus the need show as a Webview . The primary need for this is to be able see a weather map both locally and remotely when outside your home and to NOT open up port 8080 to the outside world.
This works on Ubuntu Server 16, thus may or may not work under Habian and Windows users would need a different approach as well. But if you are on Ubuntu or similar, the below is what was done.
Note, I am using the Wunderground binding for my primary weather temps, and also the Weather 1.x binding also configured with a Wunderground API key for the map.
With some google searching, I found a way to convert html to png and came across http://phantomjs.org/ which has a good, easy way to convert the weather to an image. This program phantomjs appears it may also be useful for many things including making your own custom colorwheel, but thatâs probably beyond my skill level at this point.
The basic steps I followed for Ubuntu Server 16 are as follows.
-
I used these instructions to Install Phantomjs
https://www.vultr.com/docs/how-to-install-phantomjs-on-ubuntu-16-04 -
Created a basic script and placed it in /etc/openhab2/scripts called weather.js
var page = require('webpage').create();
page.open('http://YOURIPADDRESS:8080/weather?locationId=home&layout=example&iconset=colorful', function() {
page.evaluate(function() {
document.body.bgColor = 'white';
});
page.render('/etc/openhab2/html/images/weather.png');
phantom.exit();
});
You can see the above will place the image in your âhtml/imagesâ directory. And you can run the script manually like such:
phantomjs /etc/openhab2/scripts/weather.js
- With use of the Exec binding installed and the ExecuteCommand line in a rule. The below rule will update the image every 30 minutes.
rule "Create Weather Map Every 30 minutes"
when
Time cron "0 /30 * * * ?" or
System started
then
//Create Image of the Weather for SiteMap
var cmd = 'phantomjs@@/etc/openhab2/scripts/weather.js'
executeCommandLine(cmd)
end
- And then finally in my sitemap I reference the image and can see it both locally and when outside the home
Image url="http://YOURIPADDRESS:8080/static/images/weather.png"