Bachelor thesis: Optimization methods used in Flotr2?

112 views
Skip to first unread message

Artur Käpp

unread,
Apr 13, 2014, 8:56:53 PM4/13/14
to flo...@googlegroups.com
I'm writing a bachelor thesis about JavaScript graphing capabilities. I'm going to research into SVG and Canvas and as for practical part I'm trying to compare different graphing frameworks, Flotr2 being one of them.

Currently I have made 4 similar looking line charts with 4 different frameworks. Now I'm going to see how these charts react when data amount is starting to increase up to 100,000 and even further. I'm trying to see if I am able to compare these frameworks.

I have come here to acquire information on the following:
1) Optimization methods used in Flotr2? 
2) Problems worth mentioning in the creation of Flotr2?
3) Anything that you think makes Flotr2 more unique/better than any other similar framework?
...
So I'm looking for pretty much anything that You think to be worth mentioning about Flotr2. Anything You think that might help me create a better thesis. Any ideas, that You might have, where I can direct my work into, to make it more complex.

Quite general questions. So it might be easier to answer on a narrowed scope: For creating simple line & scatter charts.

Any help is much appreciated!


Artur Käpp

Carl Sutherland

unread,
May 9, 2014, 3:21:45 PM5/9/14
to art...@gmail.com, flotr2
Hey Artur, sorry for the long delay in this.  I hope it's still relevant.

1) Flotr2 doesn't do anything too fancy for optimization.  I employ usual js-microoptimiztion techniques and cache the canvas element between redraws.  My envisionjs library does subsampling of large data sets when drawing.  It takes a minimum and maximum from your dataset for every 2 pixels of screen real-estate and draws that.  This comfortably draws millions of points in real time (using Flotr2 as the charts/graphs backend).

2) Flotr2's biggest problem is that it is a legacy code base supporting old browsers.  I inherited the project from Flotr and intern jQuery.flot, so there's a ton of cruft and it's difficult and unpleasant to maintain.  Honestly, it begs a ground-up rewrite which I'd love to do if I ever get the time :-)

3) There are many similar charts and graphs libraries.  Today Flotr2's big advantage is speed (it uses canvas instead of SVG, so it has an advantage particularly on mobile systems) and touch event support.  Disadvantages would be flexibility of the API itself.  It's pretty home-grown, and isn't a great framework for creating new or abstract data visualizations (something d3 really shines at).

In general, I think a thesis on optimizing drawing techniques for charts in Canvas, SVG or both would be very interesting.

What other libraries are you looking at?

Best,
-Carl


--
You received this message because you are subscribed to the Google Groups "flotr2" group.
To unsubscribe from this group and stop receiving emails from it, send an email to flotr2+un...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Reply all
Reply to author
Forward
0 new messages