§

HTML

<div id="volumeReport">
  <script src="http://d3js.org/d3.v3.min.js"></script>
  <script src="http://dimplejs.org/dist/dimple.v2.1.0.min.js"></script>
</div>

JavaScript

var svg = dimple.newSvg("#volumeReport", 590, 500);
var data = [
{"Date": "22/7/2014", "Volume" : 0},
{"Date": "15/11/2014", "Volume" : 1000},
{"Date": "5/01/2015", "Volume" : 2000},
{"Date": "5/2/2015", "Volume" : 3000},
{"Date": "31/3/2015", "Volume" : 4000},
];
var myChart = new dimple.chart(svg, data);
myChart.setBounds(60, 30, 510, 305)
var x = myChart.addTimeAxis("x", "Date", "%d-%m-%Y %H:%M:%S:%L", "%d-%m-%Y");
x.addOrderRule("Date");
x.timeField = "Date";
x.dateParseFormat = "%d/%m/%Y";
myChart.addMeasureAxis("y", "Volume");
var s = myChart.addSeries(null, dimple.plot.area);
s.interpolation = "step";
s.lineWeight = 1;
s.lineMarkers = true;
myChart.draw();