Ajax Bestiary: A Javascript Field Guide
 
Ajax Bestiary: A Javascript Field Guide
 
 

Flot 0.2 Released

Posted by Don Albrecht

Ole Larson has released a new version of Flot:
Key Changes

  • Added support for putting a background behind the default legend.
    The default is the partly transparent background color. Added
    backgroundColor and backgroundOpacity to the legend options to control
    this.
  • The ticks options can now be a callback function that takes one
    parameter, an object with the attributes min and max. The function
    should return a ticks array.
  • Added labelFormatter option in legend, useful for turning the legend
    labels into links.
  • Fixed a couple of bugs.
  • The API should now be fully documented.
  • Patch from Guy Fraser to make parts of the code smaller.
  • API changes: Moved labelMargin option to grid from x/yaxis.

Most notably, the new packaging includes the modified excanvas script in the zip download to greatly simplify deploying with IE support.

Read about it here:

http://ole-laursen.blogspot.com/2007/12/flot-02-released.html 

Google Charts API

Posted by Don Albrecht

Yellow line chartOutsource your charting to Google!  Yesterday I discussed my initial experiences with the Flot charting library.   Today, I’m going to give you a brief introduction to the excellent new Google Charting API.How it works, simply embed an image tag in your source that references the google chart API location followed by a set of parameters specifying the actual chart.  Google then renders the chart as a PNG that can be displayed in the browser.Features:

 

Parameter Line chart Scatter plot Bar chart Venn diagram Pie chart 
Chart title Yes Yes Yes Yes Yes
Chart legend Yes Yes Yes Yes Yes
Colors Yes Yes Yes Yes Yes
Chart and background fill Yes Yes Yes Yes Yes
Multiple axis labels Yes Yes Yes    
Grid lines Yes Yes      
Shape markers Yes Yes      
Horizontal range markers Yes Yes      
Vertical range markers Yes Yes      
Line styles Yes        
Fill area Yes        
Pie chart labels         Yes

24 Hours with Flot

Posted by Don Albrecht

flot2.pngAlright, So Flot 0.1 has been out in the wild for just under 2 days now and it’s gotten some pretty decent traction with the Ajax blogs.  I’ve taken some time over the past 24 hours to work with the library and I have to say, It’s pretty awesome. Highlights:  

  • The presets really are excellent , simple charts are very little work.
  • The charts look great, the integrated support for shadows & alpha channels really makes them shine
  • The underlying architecture is excellent.  I’ve been able to get under the hood and add needed features without any major headaches. 
  • jQuery based

Shown: A chart created with a modified version of Flot with normal range highlighted. You can get flot at: http://code.google.com/p/flot/

Plotr Well Built, Prototype Based Charting

Posted by Don Albrecht

plotr

Plotr is an excellent charting library built in prototype.  It outputs to a Canvas / SVG drawing object. (IE 6+ Support is powered by the ExplorerCanvas library).

It currently supports:

  • Bar Charts
  • Line Charts
  • Pie Charts
  • Chart Legends

All in all, it’s an excellent lightweight library for adding basic data visualization capabilities to your app.  More importantly, the chart’s it generates are simply stunning, complete with drop shadows, white outlines, & well designed default color schemes.

Check it out online here:

http://solutoire.com/plotr/