
Smoothie Charts: a small javascript charting library for live streaming data - gbaygon
http://smoothiecharts.org/
======
benohear
Nice, but beware that this kind of thing can be quite resource intensive (the
triple chart demo takes over 60% of CPU on Chrome running on a netbook).

I was also wondering why this is done with canvas rather than SVG.

~~~
joewalnes
(I'm the author)

An initial version of SmoothieCharts used SVG, but I switched to Canvas
because I got slightly better performance (which actually surprised me).

That's not strictly true - for very large charts, the SVG ones performed
better, but I optimized for the common case.

Recently I've been experimenting with a WebGL version - it gives MUCH better
performance than both Canvas (2D) and SVG, but only works on the most recent
browsers.

~~~
pfraze
Cool-- please do release the webgl one, if you finish it.

------
mbostock
Nice; animated transitions are great for maintaining continuity when data is
changing. Handling changes in the y-scale can be another source of
distraction, so it's nice if you're able to fix the domain (as [0,1] in your
example).

In January, I wrote a tutorial on how to implement this sort of real-time
graph in D3.js, using transform transitions. (Don't get distracted by the top
example; it's intentionally wonky.)

<http://bost.ocks.org/mike/path/>

------
TazeTSchnitzel
I was pleasantly surprised this worked fine on my 3DS. No "script execution
taking too long", no "page content too large".

It's nice that not everything requires jQuery these days.

------
ndcrandall
This library is very interesting. I have been working on an MVP for my startup
that pushes and receives live data over a websockets. So far we have been
unimpressed with most of the current libraries out there. The important thing
is responsiveness, especially on mobile browsers.

I am currently using <http://rgraph.net> and redrawing the graph every so
often to get the live feel. I would like to know how your graph performs
compared to rgraph?

------
catshirt
i replied in an earlier thread about smooth.js, an interpolation library,
about how it was something i was looking for a week ago.

really, that was only a small part of the problem. what i was actually looking
for, was a small charting library for live streaming data. thanks!

------
mmisu
Looks neat. What about browsers support ? Can you use it from IE8 ?

~~~
gbaygon
It works on Chrome, FF and Opera. It doesn't seem to work on ie8/9 (maybe
canvas issues).

~~~
mmisu
I think IE8 doesn't have the canvas element.

~~~
joelbirchler
Explorercanvas will help you out here. I am not sure if it can keep up, but it
performs very well. <http://code.google.com/p/explorercanvas/>

~~~
gbaygon
Just tried it, renders nicely but it doesn't animate.

------
novalis
Lovely stuff sir. Thanks for sharing.

------
phob
What advantage does this have over flot?

