JSFiddle - React, Tailwind, and code Playground

HTML

<div id="test" style="width: 400px; height: 240px; margin: 30px auto 0px auto;"></div>

JavaScript

require([
				"dojox/charting/Chart",
				"dojox/charting/themes/MiamiNice",

				"dojox/charting/plot2d/ClusteredColumns",
				
				"dojox/charting/plot2d/StackedLines",
				"dojox/charting/plot2d/Markers",
				"dojox/charting/axis2d/Default",
				"dojo/domReady!"
			], function(Chart, theme, ClusturedColumns) {

				// Define the data
				var colX = [21,76,98,56];
				var colY = [46,98,67,55];
				
                var stkY = [45,87,76,65];
                var stkX = [34,34,56,67];
				// Create the chart within it's "holding" node
				var chart = new Chart("test");

				// Set the theme
				chart.setTheme(theme);
			
			
				chart.addPlot("sttt",  {
					type: "StackedLines",
					markers: true,
					tension:"S"
					//,shadow:	 {dx: 1, dy: 1, width: 1, color: [0, 0, 0, 0.3]}
				});
			
			chart.addPlot("default", {
					type: ClusturedColumns,
					markers: true,
					gap: 25,
					htmlLabels: false
				});
				
				


				// Add axes
				chart.addAxis("x",{htmlLabels: false});
				chart.addAxis("y", { vertical: true, fixLower: "major", fixUpper: "major",htmlLabels: false });
				
				// Add the series of data
				chart.addSeries("Series A",colX,{ stroke: {color: "red"}, fill: "lightpink" });
                chart.addSeries("Series B",colY,{stroke: {color: "blue"}, fill: "lightblue"});

				
			chart.addSeries("sttt", stkX, 
						{plot: "sttt", stroke: {color:"#0f0",width:1},fill:"#00f",marker: "m-3,0 c0,-4 6,-4 6,0 m-6,0 c0,4 6,4 6,0"});
		
		

				// Render the chart!
				chart.render();

				
			});