JSFiddle - React, Tailwind, and code Playground

by Brock Whittaker

HTML

<script src="http://lavancier.com/brockCharts/API/GenerateRandomDist.js"></script>
<canvas id="myCanvas" width="578" height="200"></canvas>

JavaScript

array = [];
for (x = 0; x < 100000; x++) {
    GenerateRandomDist(1, 0);
    array[x] = Math.round((1 - DailyReturn) * 1000) / 1000;
}

distribution = [];
z = 0;
for (x = -0.050; x <= 0.050; x = x + 0.001) {
    counter = 0;
    for (y = 0; y < array.length; y++) {
        if (array[y] < x) {
            counter++;
        }
    }
    distribution[z] = counter;
    z++;
}

actualDistribution = [];

for (x = 1; x < distribution.length; x++) {
    actualDistribution[x] = distribution[x] - distribution[x - 1];
}

for (x = 0; x < distribution.length; x++) {
    document.write(((x / 1000) - 0.05) + " has a count of " + actualDistribution[x] + "<br />");
}

var array = settings.array;
var canvas = document.getElementById(settings.canvasName);
var context = canvas.getContext('2d');
var width = settings.width;
var height = settings.height;
var graphShift = settings.graphShift;
var lineWidth = settings.lineProperties.lineWidth;
var lineColor = settings.lineProperties.lineColor;
var areaEnclose = settings.lineProperties.areaChart;
var fillColor = settings.lineProperties.fillColor;
var title = settings.textProperties.titleProperties.title;
var fontSize = settings.textProperties.titleProperties.fontSize;
var fontFamily = settings.textProperties.titleProperties.fontFamily;
var fontColor = settings.textProperties.titleProperties.fontColor;
var titlePadding = settings.textProperties.titleProperties.titlePadding;
var axis = settings.textProperties.axisProperties.axis;
var axisSize = settings.textProperties.axisProperties.axisSize;
var axisColor = settings.textProperties.axisProperties.axisColor;


var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');

context.beginPath();
context.rect(188, 50, 200, 100);
context.fillStyle = 'yellow';
context.fill();
context.lineWidth = 7;
context.strokeStyle = 'black';
context.stroke();