New Visualisation Widget - Smoothie realtime

Submitted by Guest on Thu, 19/04/2012 - 17:11

Hey Guys, I just spent a bit of time putting together a new widget using the Smoothie charts api (http://smoothiecharts.org/).

It seems to work really well, you can see some pictures below:

It also works really well on iPhone and other mobile browsers..

Just a note to view it on the iPhone full screen you must first visit the page in safari, then add the page to your home screen, then the next time you open it (from the home screen) it will be shown in full screen mode.

To install it add the smoothie.php file to your emoncms3/Vis/ Folder then you can either view it directly with:

http://YOURSERVER/emoncms3/Vis/smoothie?feedid=1&feedid2=2&apikey=APIKEY...

Where feedid and feedid2 are the ID for the two feeds you want to graph (the second one being optional) and ufac being the "update factor" or basically the delay for the graph so it seems like its showing in real time (it builds up in this example 20 seconds of data then starts showing it to you).

I also put another little html page together so i can browse to it easily showing the page in an iframe, its in the attachments as s.php you can also put this in the /Vis/ directory or anywhere else just make sure you set the src correctly for the iframe, or put it in your dashboard with:

apikey=APIKEY&feedid=9&ufac=23000">

</iframe>

You must also have the smoothie.js file and put it in the /Vis/ folder with everything else.

I've uploaded a slightly modified version (just changed line 44 from true to false) so that the graph doesn't keep re-adjusting the window.

Also make sure you remove the _.txt from the three files in the attachments when you put them on your server. (forum file uploader doesnt like .php and .js files)

Please feel free to play around and fix up my very rushed code!

Attachment	Size
smoothie.php_.txt	3.54 KB
s.php_.txt	915 bytes
smoothie.js_.txt	12.06 KB

Re: New Visualisation Widget - Smoothie realtime

Submitted by TrystanLea on Fri, 20/04/2012 - 09:04.

Wow, very nice! will try it out thanks a lot!

Re: New Visualisation Widget - Smoothie realtime

Submitted by Larsjo on Fri, 20/04/2012 - 10:38.

Looks nice, will have a go on it.

Thx for the work.

__________________________

cant get it to work.

I put in my APIkey (read) and my feedid

Get at fine scrolling black box, but no data.

apikey=f19a2cceacf6f7c5021a11dae45f842c&feedid=3&feedid2=4&ufac=23000">

</iframe>

Any help ?

http://juelsminde.org/solceller/

Re: New Visualisation Widget - Smoothie realtime

Submitted by Shervanator (not verified) on Fri, 20/04/2012 - 12:02.

Ah i see whats wrong, if you want to put it in a smoothie folder within the Vis folder (so: /Vis/smoothie/ which is probably a better idea) then use this new version of the smoothie.php

(I changed line 13 to be 'Vis/smoothie', '', $_SERVER['SCRIPT_NAME']))."/";).

Attachment	Size
smoothie.php_.txt	3.55 KB

Re: New Visualisation Widget - Smoothie realtime

Submitted by Larsjo on Fri, 20/04/2012 - 14:21.

I dont think its the path thats the problem, because i get a black scrolling layout. Just missing the data from the feed.

Even when i change the php to point direct to my paht, there is still no feeds.

Re: New Visualisation Widget - Smoothie realtime

Submitted by Shervanator (not verified) on Fri, 20/04/2012 - 14:59.

Basically what you want your $path variable to be set to for your project is http://juelsminde.org/sol/

This line should have got that for you:

$path = dirname("http://".$_SERVER['HTTP_HOST'].str_replace('Vis/smoothie', '', $_SERVER['SCRIPT_NAME']))."/";

You could try commenting out lines 14 and 15 (with // put in front of it) so the stuff above (since its split over two lines).

And then set:

$path = "http://juelsminde.org/sol/";

see if that fixes it

Re: New Visualisation Widget - Smoothie realtime

Submitted by Larsjo on Fri, 20/04/2012 - 17:07.

hehe, just found out that i had to wait for the graph to show, 20 sec is a long time. and when ever i press F5 gess i have to wait again.

Sorry...

Re: New Visualisation Widget - Smoothie realtime

Submitted by PeterN on Sun, 29/04/2012 - 10:55.

Nice addition Shervin thanks. Looks great, very clean.

I also agree 20 seconds is a very long time even when expecting it.

Cheers

Re: New Visualisation Widget - Smoothie realtime

Submitted by TrystanLea on Sun, 29/04/2012 - 17:27.

Hello Shervin, I've added it to the emoncms github repo exactly as you detail above. its really great, thanks a lot!

OpenEnergyMonitor