Charts? (Image)

[Steve]

Hello!

I have a problem again.I want to include a chart in OpenHAB, but now I have a question.

In my system there is a Rest-Service, which provides different data of temperature and humidity and this data I want to put in a chart and include it in OpenHAB.
But I have different ideas of how to implement it and maybe you could help me.

Ideas:

• Instead of sending the temperature data, I could create with java and jFreeChart a picture of a chart- and send this picture to OpenHAB2.
  -How to change the Image dynamically? Is there the possibility of creating some normal buttons for (day-view, week-view, year)?
• Creating the chart with rr4dj. But how to implement Rest-Data?
• Or creating with jsp and js a webpage and implement it with a webview?

What's the best approach?

Maybe you could help me!

Steve

[Kai Kreuzer]

What's the best approach?

It probably depends on whether you want the whole history from your database or if it is ok to start duplicating the data in openHAB.

If the latter is ok, the cleanest integration would be to define items for your temperature and humidity and bind them to your REST service through the HTTP binding and persist them through rrd4j.

Then you could use the standard charting mechanisms of openHAB.

If you want to retrieve the full data always from your external system, I would go for the first option and provide an image that you can simply include in your sitemap (see https://github.com/openhab/openhab/wiki/Explanation-of-Sitemaps#element-image).

Regards,

Kai

--
You received this message because you are subscribed to the Google Groups "openhab2" group.
To unsubscribe from this group and stop receiving emails from it, send an email to openhab2+u...@googlegroups.com.
To post to this group, send email to open...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/openhab2/9f957f6f-47bf-4009-af1c-e041133a78b2%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Steve]

Hi Kai!

Thank you for your answer!

Yes I would prefer pictures, because I can create them with an other design.

But if I want to switch between several pictures (day,week,year-view), how does it work?
Can I switch or change the Image URL by pressing some buttons?
How does it work?

Regards

Steve

[Kai Kreuzer]

Can I switch or change the Image URL by pressing some buttons? 

Yes, this is exactly what the demo sitemap does, see https://github.com/openhab/openhab2/blob/master/distribution/openhabhome/conf/sitemaps/demo.sitemap#L18

--
You received this message because you are subscribed to the Google Groups "openhab2" group.
To unsubscribe from this group and stop receiving emails from it, send an email to openhab2+u...@googlegroups.com.
To post to this group, send email to open...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/openhab2/203b9889-b113-4cbe-8ee7-e2daf2d7548c%40googlegroups.com.

[Steve]

Oh, ok Thank you!


But is there a bug in OH2 for displaying images?


" Image item=pic url="http://127.0.0.1:8085/images.jpg" refresh=10000 "

I tried this code in OH 1.7 and it works without any problems, but in OH2 there is just a blank screen(screenshot is dettached).
Even the picture of the demo isn't displayed.
Is it a bug or is it my fault?

Regards

Steve

[Steve]

Screenshot

[Peter]

Hi,


I want to add, that I have the same problem with displaying the picture! It doesn't work in the demo snapshot of OH2 too.
I also tried it in a 1.x. Version and it works, but with OH2 it doesn't.


Regards
Peter

[Kai Kreuzer]

Hi Steve, hi Peter,

I can confirm that this is broken - I’ll work on a fix asap!

Regards,

Kai

--
You received this message because you are subscribed to the Google Groups "openhab2" group.
To unsubscribe from this group and stop receiving emails from it, send an email to openhab2+u...@googlegroups.com.
To post to this group, send email to open...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/openhab2/229b189c-8349-44a7-91d8-c380e6603067%40googlegroups.com.

[Kai Kreuzer]

Fixed the problem with the latest build: https://openhab.ci.cloudbees.com/job/openHAB2/278/

Best regards,

Kai

To view this discussion on the web visit https://groups.google.com/d/msgid/openhab2/47D7BA4B-0859-436E-AFC4-D0FBFF66B8EF%40openhab.org.

[Steve]

Thank you very much Kai!
Now it works!

I'm very sorry to annoy you one more time, but is there a possibility for changing the size of an image? I have the problem that OpenHAB renders my Image too big (heigth) and so it's very hard and unconfortable to read the chart.
So maybe is there a possibility of setting the heigth of image in percent?


Regards
Stebe

[Kai Kreuzer]

Hi Steve,

No need to be sorry :-)
The Classic UI always scales images to fill the width of the screen; so the only way to reduce the height would be to change the aspect ratio (i.e. generate your image with white bars at the side).

Regards,
Kai

[Greg EVA]

Not sure if this has been considered, but it might be an idea to add a parameter to the image widget to be able to specify NOT to scale the image and display it just as is.  This would surely display badly sometimes, but would also allow viewing things like designed charts as they were intended.

As an aside thought.... is the "display resolution" passed through to the web server from the client so that for example a CGI program which is drawing the image could draw it to be suited to the screen/window upon which it will be displayed?

Cheers

Greg

[Steve]

Thank you very much Kai!!

And my last question about images: Does the refresh work correctly?
It doesn't seem to refresh. When I change the picture in the directory, nothing happens in OpenHAB.
Do I something wrong?

"Image url="http://127.0.0.1:8085/graph.jpeg" refresh=3000 "

Thanks Kai!


Regards Steve

[Chris Jackson]

You can scale the charts now - I think the setting is scale=xx where xx is a value between 0 and 1. This doesn’t change the size, since this is set by the UI, but it changes the way the image is created which allows the text to be scaled better.

[Greg EVA]

The refresh seems to be handled by the UI itself, so it is only receiving this sitemap configured value from OpenHAB.  I--and others--have issues with this using the native Android app w/ OH 1.7.  That said, it ought to work using the built-in web UI.

[Steve]

Hi Greg!
So it should work by using the web UI ? But I tried it on every device and with every browser, but it simply doesn't work?
Is it an common problem ?

Steve

[Chris Jackson]

The way this works is each time you make the request to the chart URI, the chart is (re)generated and the PNG is returned. So, the refresh is down to how often the UI calls the URI.  If the URL you are using to generate the chart is "http://127.0.0.1:8085/graph.jpeg" refresh=3000 “ as you mentioned previously, then this is invalid. 

If I remember correctly, the URI for the chart is at /chart, and there are other parameters required to set up the parameters for the chart (e.g. the items you want to graph, the period etc).

Chris

[Kai Kreuzer]

Chris, I think Steve is not talking about Charts here, but about Images. And according to https://github.com/openhab/openhab/wiki/Explanation-of-Sitemaps#element-image, the refresh parameter is valid and it should tell the UI to automatically refresh the image. I wouldn't rule out though that this is currently broken in the Classic UI, I haven't had the time to test it myself right now.

[Greg EVA]

I just tested this chart refresh (not image) on 1.7 using the Classic web UI and it does not work.  I do in fact now recall having come across this before.  So I wouldn't be surprised that this is carried through to OH2.

FYI - I tried refresh intervals of 60000 and 300000 milliseconds.

[Kai Kreuzer]

I just tested the same on openHAB 2 and can confirm that it does not work. The generated HTML contains

<img style="padding:10px;width:90%" src="/chart?groups=Weather_Chart&amp;period=h&amp;random=1" id="01010101" onload="setTimeout('reloadImage(\'/chart?groups=Weather_Chart&amp;period=h&amp;random=1\', \'01010101\')', 600)">

So in general, I would expect it to work. But maybe there is some flaw with the Javascript. Is there any expert who can tell what's wrong with it?

I have created https://bugs.eclipse.org/bugs/show_bug.cgi?id=473933 for further tracking.

Regards,
Kai

[Stefan Andres]

I have debug the rendered site.

What I see, that the javascript function:

function reloadImage(url, id) {
 if(imageRefresh) {
    document.getElementById(id).src=url + new Date().getMilliseconds();
 }
}

is called for each refresh interval. But the variable imageRefesh is false (0). So the refreshing will not done.

In

 https://github.com/eclipse/smarthome/blob/8078ab2d0f8da486563dc03df71e87efa7e8a277/bundles/ui/org.eclipse.smarthome.ui.classic/src/main/java/org/eclipse/smarthome/ui/classic/internal/render/ChartRenderer.java

the variable  imagesToRefreshOnPage  is set to 1 (true) :

if (chart.getRefresh() > 0) {

               snippet = StringUtils.replace(snippet, "%setrefresh%",

                       "<script type=\"text/javascript\">imagesToRefreshOnPage=1</script>");

               snippet = StringUtils.replace(snippet, "%refresh%",

                       "id=\"%id%\" onload=\"setTimeout('reloadImage(\\'%url%\\', \\'%id%\\')', " + chart.getRefresh()

                               + ")\"");

           }

The generated code I found also:

.
<script type="text/javascript">imagesToRefreshOnPage=1</script>
.
.

<img style="padding:10px;width:90%" src="/

chart?groups=Weather_Chart&amp;period=h&amp;random=1" id="01010101" onload="setTimeout('reloadImage(\'/chart?groups=Weather_Chart&amp;period=h&amp;random=1\', \'01010101\')', 600)">
...

I have not analised the code of the render but my feeling is:

1. if the variable imagesToRefreshOnPage is true the update of images will done on server site.
   (I have test this with code in the demo.sitemap: Image url="http://localhost:8080/chart?groups=Weather_Chart&period=h" refresh=500 and it is refeshed without the function reloadImage() )
2. if the variable imageRefesh is true the browser site call the refresh.

I think if the variable imagesToRefreshOnPage is changed to imageRefesh it will work.

I have no smarthome IDE installed. So it is complicated to test this.

I hope it will help.

Regards Stefan

[Kai Kreuzer]

I think if the variable imagesToRefreshOnPage is changed to imageRefesh it will work.

I just tried this - unfortunately, it didn’t make any difference.

@sja: Did you by any chance work on the reloading mechanism? I wonder how the variable name came out of sync…

Regards,

Kai

--
You received this message because you are subscribed to the Google Groups "openhab2" group.
To unsubscribe from this group and stop receiving emails from it, send an email to openhab2+u...@googlegroups.com.
To post to this group, send email to open...@googlegroups.com.

To view this discussion on the web visit https://groups.google.com/d/msgid/openhab2/2b164f8f-7e01-4e23-bcbf-02e4bc243145%40googlegroups.com.