diff --git a/views/market_view.html b/views/market_view.html
index 7d56d80..037db5d 100644
--- a/views/market_view.html
+++ b/views/market_view.html
@@ -286,35 +286,43 @@ <h4 class="font-weight-bold">Trade History</h4>
 	});
 
 	// prepare chart datasets
-	var buyOrderLabels = _.uniq(data.buy_orders.map(o => parseFloat(o.price)));
-	var buyOrderDataset = [];
-	var buyOrderCurrentVolume = 0;
-	buyOrderLabels.forEach(label => {
-		let matchingBuyOrders = data.buy_orders.filter(o => parseFloat(o.price) === label);
-
-		if (matchingBuyOrders.length === 0) {
-			buyOrderDataset.push(null);
-		} else {
-			buyOrderCurrentVolume = buyOrderCurrentVolume + matchingBuyOrders.reduce((acc, val) => acc + parseFloat(val.quantity), 0);
-			buyOrderDataset.push(buyOrderCurrentVolume);
-		}
-	});
-	buyOrderLabels.reverse();
-	buyOrderDataset.reverse();
-
-	var sellOrderLabels = _.uniq(data.sell_orders.map(o => parseFloat(o.price)));
-	var sellOrderDataset = _.fill(Array(buyOrderDataset.length), null);
-	var sellOrderCurrentVolume = 0;
-	sellOrderLabels.forEach(label => {
-		let matchingSellOrders = data.sell_orders.filter(o => parseFloat(o.price) === label);
-
-		if (matchingSellOrders.length === 0) {
-			sellOrderDataset.push(null);
-		} else {
-			sellOrderCurrentVolume = sellOrderCurrentVolume + matchingSellOrders.reduce((acc, val) => acc + parseFloat(val.quantity), 0);
-			sellOrderDataset.push(sellOrderCurrentVolume);
-		}
-	});
+	for (let i = 0; i < data.sell_orders.length; i++) {
+		data.sell_orders[i].stacked_volume = parseFloat(data.sell_orders[i].quantity) * parseFloat(data.sell_orders[i].price)
+		if (i > 0)
+			data.sell_orders[i].stacked_volume += data.sell_orders[i-1].stacked_volume
+	}
+	for (let i = 0; i < data.buy_orders.length; i++) {
+		data.buy_orders[i].stacked_volume = parseFloat(data.buy_orders[i].quantity) * parseFloat(data.buy_orders[i].price)
+		if (i > 0)
+			data.buy_orders[i].stacked_volume += data.buy_orders[i-1].stacked_volume
+	}
+	var datasets = []
+	if (data.buy_orders.length > 0)
+		datasets.push({
+			label: 'Buy',
+			steppedLine: 'after',
+			borderColor: '#88e86b',
+			backgroundColor: '#a9ea96',
+			data: data.buy_orders.map(o => { 
+				return { 
+					x:parseFloat(o.price),
+					y:parseFloat(o.stacked_volume)
+				}
+			}).concat({x:0, y: data.buy_orders[data.buy_orders.length-1].stacked_volume})
+		})
+	if (data.sell_orders.length > 0)
+		datasets.push({
+			label: 'Sell',
+			steppedLine: 'before',
+			borderColor: '#e45858',
+			backgroundColor: '#e87f7f',
+			data: data.sell_orders.map(o => { 
+				return { 
+					x:parseFloat(o.price),
+					y:parseFloat(o.stacked_volume)
+				}
+			})
+		})
 
 	// draw chart
 	var chart_ctx = $("#market_depth_chart");
@@ -324,26 +332,18 @@ <h4 class="font-weight-bold">Trade History</h4>
 			display: false
 		},
 		data: {
-			labels: buyOrderLabels.concat(sellOrderLabels),
-			datasets: [
-				{
-					label: 'Buy',
-					steppedLine: 'after',
-					borderColor: '#88e86b',
-					backgroundColor: '#a9ea96',
-					data: buyOrderDataset
-				},
-				{
-					label: 'Sell',
-					steppedLine: 'before',
-					borderColor: '#e45858',
-					backgroundColor: '#e87f7f',
-					data: sellOrderDataset
-				}
-			]
+			datasets: datasets
 		},
 		options: {
-			steppedLine: true
+			steppedLine: true,
+			scales: {
+				yAxes: [{
+					stacked: true
+				}],
+				xAxes: [{
+					type: 'linear'
+				}]
+			}
 		}
 	});