Edit in JSFiddle

	//Create a CIQ.ChartEngine object, the main object for drawing charts. 
	var stxx = new CIQ.ChartEngine({
	  container: $$$(".chartContainer")
	});

	// enable crosshairs
	stxx.layout.crosshair = true;

	// display the chart 
	stxx.setChartType("marketdepth_mountain_volume");
	stxx.chart.tension = 0.5;
	stxx.manageTouchAndMouse = false;
	stxx.newChart("Market Depth", [], null, null, {
	  periodicity: {
	    interval: 'tick'
	  }
	});

	// Sample data
	var newData = {
	  DT: new Date("2018-07-30T04:00:00.000Z"),
	  Last: 125.48,
	  BidL2: [
	    [116.19, 4],
	    [116.32, 1],
	    [116.7, 2],
	    [118.45, 4],
	    [119.21, 4],
	    [120.08, 10],
	    [120.46, 2],
	    [120.59, 10],
	    [120.71, 3],
	    [120.84, 4],
	    [120.96, 8],
	    [121.21, 2],
	    [121.34, 21],
	    [121.72, 1],
	    [121.97, 5],
	    [122.09, 1],
	    [122.22, 38],
	    [122.34, 6],
	    [122.47, 45],
	    [122.72, 6],
	    [122.84, 5],
	    [122.97, 5],
	    [123.1, 4],
	    [123.22, 61],
	    [123.35, 10],
	    [123.47, 8],
	    [123.6, 59],
	    [123.72, 2],
	    [123.97, 8],
	    [124.1, 3],
	    [124.23, 90],
	    [124.35, 4],
	    [124.48, 97],
	    [124.73, 13],
	    [124.85, 122],
	    [124.98, 4],
	    [125.1, 13],
	    [125.23, 204],
	    [125.35, 25]
	  ],

	  AskL2: [
	    [125.61, 6],
	    [125.73, 223],
	    [125.86, 37],
	    [125.98, 13],
	    [126.11, 187],
	    [126.23, 8],
	    [126.36, 5],
	    [126.48, 11],
	    [126.61, 137],
	    [126.73, 12],
	    [126.86, 122],
	    [126.99, 10],
	    [127.11, 3],
	    [127.24, 6],
	    [127.36, 10],
	    [127.49, 1],
	    [127.74, 1],
	    [127.86, 91],
	    [127.99, 7],
	    [128.12, 1],
	    [128.37, 5],
	    [128.49, 8],
	    [128.62, 3],
	    [128.74, 7],
	    [128.87, 55],
	    [128.99, 12],
	    [129.12, 6],
	    [129.75, 6],
	    [129.87, 44],
	    [130.25, 6],
	    [130.37, 4],
	    [130.5, 5],
	    [130.62, 7],
	    [130.75, 3],
	    [131.25, 5],
	    [131.38, 13],
	    [131.88, 4],
	    [132.76, 6],
	    [133.39, 3],
	    [135.14, 5]
	  ]
	}

	// Call these 2 lines as often as you wish to refresh the data.
	stxx.updateCurrentMarketData(newData);
	stxx.draw();
<link rel="stylesheet" type="text/css" href="https://jsfiddle.chartiq.com/chart/plugins/cryptoiq/cryptoiq.css" media="screen" />
<!-- Required - market depth styles -->


<div class="chartContainer" style="width:100%;height:400px;position:relative;"></div>

<script src="https://jsfiddle.chartiq.com/chart/js/chartiq.js"></script>
<script src="https://jsfiddle.chartiq.com/chart/plugins/cryptoiq/marketdepth.js"></script>
<script src="https://jsfiddle.chartiq.com/chart/js/thirdparty/splines.js"></script>
<!-- Required only if you want smooth lines on the market depth chart -->