Merge pull request #1094 from plotly/stacked-area-update

Stacked area update

Author: michaelbabyn

_posts/plotly_js/basic/area/2015-04-09-stacked-area.html

@@ -9,18 +9,9 @@
 ---
 var plotDiv = document.getElementById('plot');
 var traces = [
-	{x: [1,2,3], y: [2,1,4], fill: 'tozeroy'},
-	{x: [1,2,3], y: [1,1,2], fill: 'tonexty'},
-	{x: [1,2,3], y: [3,0,2], fill: 'tonexty'}
+	{x: [1,2,3], y: [2,1,4], stackgroup: 'one'},
+	{x: [1,2,3], y: [1,1,2], stackgroup: 'one'},
+	{x: [1,2,3], y: [3,0,2], stackgroup: 'one'}
 ];
 
-function stackedArea(traces) {
-	for(var i=1; i<traces.length; i++) {
-		for(var j=0; j<(Math.min(traces[i]['y'].length, traces[i-1]['y'].length)); j++) {
-			traces[i]['y'][j] += traces[i-1]['y'][j];
-		}
-	}
-	return traces;
-}
-
-Plotly.newPlot(plotDiv, stackedArea(traces), {title: 'stacked and filled line chart'});
+Plotly.newPlot(plotDiv, traces), {title: 'stacked and filled line chart'});

_posts/plotly_js/basic/area/2018-09-18-normalized-stacked-area.html

@@ -0,0 +1,18 @@
+---
+name: Normalized Stacked Area Chart
+plot_url: https://codepen.io/plotly/embed/MqzvoO/?height=463&theme-id=15263&default-tab=result
+language: plotly_js
+suite: area
+order: 2.1
+sitemap: false
+arrangement: horizontal
+---
+var plotDiv = document.getElementById('plot');
+var traces = [
+	{x: [1,2,3], y: [2,1,4], stackgroup: 'one', groupnorm:'percent'},
+	{x: [1,2,3], y: [1,1,2], stackgroup: 'one'},
+	{x: [1,2,3], y: [3,0,2], stackgroup: 'one'}
+];
+
+Plotly.newPlot(stacksDiv, traces, {title: 'Normalized stacked and filled line chart'});
+