Login Register

The Dojo Charting Engine, courtesy of Greenplum and SitePen

Today, Greenplum and SitePen announced the contribution of the new Charting engine to the Dojo Toolkit. Originally designed as the foundation for the Greenplum Monitor--a browser-based database monitoring application to be released later this year--the Charting engine is a cross-browser way of creating very complex charts easily, that can be updated on a regular basis. Some of the features include:

  • A Chart can have multiple "PlotAreas" (the actual charts)
  • A PlotArea can contain multiple Plots (x/y axis + N data series)
  • Data series are bound at run-time to a dojo.collections.Store object, with flexible field bindings.
  • An Axis can have custom labeling schemes.
  • See below for plot types.
  • Each plotter can take a function at render, which will be called for every data point in that series--the node representing the point is passed, as well as the entire source object the point represents.
  • PlotAreas provide a facility for assigning colors to series (basically it has a built in HSV generator)
  • All browsers but WebKit are supported in full.
  • Rendering can be granular; right now the test only runs rendering once, but it was designed to all of constant rendering if needed.
  • A range of data points can be plotted (instead of the full data set) if so desired.
  • Trend methods are available for data analysis (but no specific plotters are built for it yet).

The Charting Engine supports the following types of plots:

  • Grouped
    • Bar
    • HorizontalBar
    • Gantt
    • StackedArea
    • StackedCurvedArea
  • Individual
    • DataBar
    • Line
    • CurvedLine
    • Area
    • CurvedArea
    • HighLow
    • HighLowClose
    • HighLowOpenClose
    • Scatter
    • Bubble

At some point there will be a full article on how to use the new Charting Engine, but for now, you can take a look at the test page to see it in action.

This would have been better

This would have been better done with SVG... But given that all the players in the SVG space have had what, 5-6 years? to get a spec defined and implemented, and they are still screwing around, the net disposes of it as damage and routes around it. So, congratulations! It looks great!

Dave, It *was* done with

Dave, It *was* done with SVG, for those browsers that support it--with a fork for VML and IE. That's what it is, and that's why the only browser not supported right now is Safari (although WebKit nightlies are getting there).

Congrats on this! Very

Congrats on this! Very cool. Best, Brad

Tom, Very cool! Will dig

Tom, Very cool! Will dig into it further.

looks good - surprised that

looks good - surprised that there was no pie chart

Mike: pie charts are pretty

Mike: pie charts are pretty poor devices for allowing the comparison of value sets. They do a good job of communicating that things are a part of a whole, but there are other ways to get there that don't need people to attempt to compare volumes, a task which our pre-perceptual filtering fails a pretty miserably.

Pie charts will be there for

Pie charts will be there for 0.5, but the nature of the chart is completely different than almost every other chart out there. There should also be log scaling and radar charts there for 0.5 as well, but we'll see how much time there is before that release.

[...] We recently announced

[...] We recently announced that Dojo has APIs for live charting. These APIs are highly specialized and are not currently based on dojo.gfx. Charts were developed before dojo.gfx was ready for production. Nevertheless, they show how much is possible in today’s browsers with vector graphics. An example: [...]

[...] Cross browser vector

[...] Cross browser vector graphics and charts. Share:These icons link to social bookmarking sites where readers can share and discover new web pages. Filed under Web by admin. Permalink • Print • Email [...]

This is cool, no doubt. I

This is cool, no doubt. I wonder if this is any better than images created by lib-gd, imagemagic, etc? Users can't save the chart. Isn't it a step backwards in a way? I'd like to see a dynamic demo, where the benefits really shine through.

[...] The Dojo Charting

[...] The Dojo Charting Engine [...]

Greetings. In my tests

Greetings. In my tests comparing the resulting charts from Mozilla to Internet Explorer, the Mozilla result seems a little blurry to me, especially with the DataBar type. I would recommend adding the following to the SVG Plotters.js to make it a little bit more clear... bar.setAttribute('shape-rendering', 'crispEdges');

Excellent chart engine. The

Excellent chart engine. The renderer really looks great. Are there any plans for other chart types like spider charts?

Mike, Other chart types are

Mike, Other chart types are in the works, but spider charts aren't generally useful. Humans have a hard time comprehending differences in area, and between that and inability to easily determine relative values along the axes (whose rotation has no data value!) spider charts come up short in almost every respect. Regards

The example link is broken

Link for tests