JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://canvg.googlecode.com/svn/trunk/canvg.js" type="text/javascript"></script>
<script src="http://canvg.googlecode.com/svn/trunk/rgbcolor.js" type="text/javascript"></script>
<script src="http://www.amcharts.com/lib/3/amcharts.js" type="text/javascript"></script>
<script src="http://www.amcharts.com/lib/3/serial.js" type="text/javascript"></script>
<script src="http://www.amcharts.com/lib/3/amstock.js" type="text/javascript"></script>
        <script type="text/javascript">
            var chart;
            var chartData = [];

            function generateChartData() {
                var firstDate = new Date(2012, 0, 1);
                firstDate.setDate(firstDate.getDate() - 500);
                firstDate.setHours(0, 0, 0, 0);

                for (var i = 0; i < 500; i++) {
                    var newDate = new Date(firstDate);
                    newDate.setDate(newDate.getDate() + i);

                    var a = Math.round(Math.random() * (40 + i)) + 100 + i;
                    var b = Math.round(Math.random() * 100000000);

                    chartData.push({
                        date: newDate,
                        value: a,
                        volume: b
                    });
                }
            }

            AmCharts.ready(function() {
                generateChartData();
                createStockChart();
            });

            function createStockChart() {
                chart = new AmCharts.AmStockChart();
                chart.pathToImages = "./images/";

                // DATASETS //////////////////////////////////////////
                var dataSet = new AmCharts.DataSet();
                dataSet.color = "#b0de09";
                dataSet.fieldMappings = [{
                    fromField: "value",
                    toField: "value"},
                {
                    fromField: "volume",
                    toField: "volume"}];
                dataSet.dataProvider = chartData;
             ...

JavaScript

// Extend AmCharts object
            AmCharts.getExport = function(id) {
                var wrapper       = document.getElementById(id);
                var svgs          = wrapper.getElementsByTagName('svg');
                var options       = {
                    ignoreAnimation :   true,
                    ignoreMouse     :   true,
                    ignoreClear     :   true,
                    ignoreDimensions:   true,
                    offsetX         :   0,
                    offsetY         :   0
                };
                var canvas        = document.createElement('canvas');
                var context       = canvas.getContext('2d');
                var counter       = {
                    height            : 0,
                    width             : 0
                }

                // Nasty workaround until somebody figured out to support images
                function removeImages(svg) {
                    var startStr    = '<image';
                    var stopStr     = '</image>';
                    var stopStrAlt  = '/>';
                    var start       = svg.indexOf(startStr);
                    var match       = '';

                    // Recursion
                    if ( start != -1 ) {
                        var stop = svg.slice(start,start+1000).indexOf(stopStr);
                        if ( stop != -1 ) {
                            svg = removeImages(svg.slice(0,start) + svg.slice(start + stop + stopStr.length,svg.length));
                        } else {
                            stop = svg.slice(start,start+1000).indexOf(stopStrAlt);
                            if ( stop != -1 ) {
                                svg = removeImages(svg.slice(0,start) + svg.slice(start + stop + stopStr.length,svg.length));
                            }
                        }
                    }
                    return svg;
                };
                
                // Setup canvas
               ...