dimple

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.v4.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.v2.3.0.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.v4.min.js"></script>
  <script src="http://dimplejs.org/dist/dimple.v2.3.0.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

Laxgeek
Jose Jimenez
Ken Ip
Robert Stettner
Berk Birand
Stanislav Frantsuzov
Sajith Sasidharan
Robert Paskowitz
Guilherme Simões
Younesben
Alex Kessaris
Scott Stafford
Neil Ahrendt
Stephen James
Flávio Juvenal
David Zhao
Han Xu
Dan Le
Keith Buchanan