dimple

An object-oriented API for business analytics powered by d3.

Libraries

Full Javascript Library With Comments
Minified Javascript Library
Zip File
Tar Ball

Resources

Examples
Advanced Examples
View On GitHub
Full API Documentation

Simply Powerful

The aim of dimple is to open up the power and flexibility of d3 to analysts. It aims to give a gentle learning curve and minimal code to achieve something productive. It also exposes the d3 objects so you can pick them up and run to create some really cool stuff.

Examples

See More Examples

Getting Started

Before you can do anything, you must link d3. Simply add the following to your html:

<script src="http://d3js.org/d3.v3.min.js"></script>

That's the organ grinder taken care of, next you need the monkey. Add dimple as follows:

<script src="http://dimplejs.org/dist/dimple.v1.1.5.min.js"></script>

That's it, you're ready to get creative! If you don't know where to start, why not create a blank text document, drop the following in and save it as an html.

<head>
  <script src="http://d3js.org/d3.v3.min.js"></script>
  <script src="http://dimplejs.org/dist/dimple.v1.1.5.min.js"></script>
</head>
<body>
  <script type="text/javascript">
    var svg = dimple.newSvg("body", 800, 600);
    var data = [
      { "Word":"Hello", "Awesomeness":2000 },
      { "Word":"World", "Awesomeness":3000 }
    ];
    var chart = new dimple.chart(svg, data);
    chart.addCategoryAxis("x", "Word");
    chart.addMeasureAxis("y", "Awesomeness");
    chart.addSeries(null, dimple.plot.bar);
    chart.draw();
  </script>
</body>

Congratulations, you are now the proud owner of a dimple bar chart! Start playing and see where you end up. You might get some extra inspiration from the examples section.

What's up Doc(umentation)!

To understand how to use a particular dimple object or method please see the Full API Documentation

Author

John Kiernander

Contributors

Flávio Juvenal
David Zhao
Han Xu
Dan Le
Keith Buchanan

Fork me on GitHub