Testing Plots Version 3

Sequential plot with line:

Code:

<div id="plotdiv"></div>
<script>
let ypts = [];
let npts = 200;
let amp = 100;
let sigma = 1.
xpts.length = 0;
ypts.length = 0;
let x0 = 0;
let x = -5*sigma;
let dx = -2*x/npts;
for (var i=0; i<npts; i++) {
    var arg = (x0-x)/sigma;
    var yv = amp*Math.exp(-.5*arg*arg);
    xpts.push(x);
    ypts.push(yv);
    x = x + dx;
}
let plot = new UMD_plot("plotdiv");
plot.plotit({
    width: 500,
    height: 500,
    xmin : 10,
    xmax : npts-10,
    background:"#a5a5a5", 
    font_size: 14, 
    xgrid: 6,
    xtitle: "xaxis",
    ytitle: "gaussian",
    xdata: "sequential",
    ydata: [{
            data: ypts,
            type: "line",
            size: 0.5,
            color: "blue"
            }]
});
</script>

Scatter plot with closed circles:

Code:

let xpts = [];
let ypts = [];
let npts = 200;
let amp = 100;
let sigma = 1.
xpts.length = 0;
ypts.length = 0;
let x0 = 0;
let x = -5*sigma;
let dx = -2*x/npts;
for (var i=0; i<npts; i++) {
    var arg = (x0-x)/sigma;
    var yv = amp*Math.exp(-.5*arg*arg);
    xpts.push(x);
    ypts.push(yv);
    x = x + dx;
}
let scatplot = new UMD_plot("scatplotdiv");
scatplot.plotit({
width: 500,
height: 500,
xmin : -5*sigma,
xmax : +5*sigma,
background:"#a5a5a5", 
font_size: 12, 
xgrid: 10,
xtitle: "xaxis",
ytitle: "gaussian",
xdata: xpts,
ydata: [{
        data: ypts,
        type: "circle",
        size: 3,
        fill: true,
        color: "purple"
        }]
});
</script>

Rectangle:

Code:

<div id="rectdiv"></div>
<script>
let xpts = [];
let ypts = [];
let npts = 20;
let amp = 100;
let sigma = 1.
xpts.length = 0;
ypts.length = 0;
let x0 = 0;
let x = -5*sigma;
let dx = -2*x/npts;
for (var i=0; i<npts; i++) {
    var arg = (x0-x)/sigma;
    var yv = amp*Math.exp(-.5*arg*arg);
    xpts.push(x);
    ypts.push(yv);
    x = x + dx;
}
let rectplot = new UMD_plot("rectdiv");
rectplot.plotit({
    width: 500,
    height: 500,
    xmin : -5*sigma,
    xmax : +5*sigma,
    background:"#a5a5a5", 
    font_size: 12, 
    xgrid: 10,
    xtitle: "xaxis",
    ytitle: "gaussian",
    xdata: xpts,
    ydata: [{
            data: ypts,
            type: "rect",
            fill: true,
            color: "purple"
            }]
});
</script>

Histogram:

Code:

<div id="histdiv"></div>
<script>
let xpts = [];
let npts = 200;
xpts.length = 0;
for (var i=0; i<npts; i++) {
    xpts.push(Math.random());
}
let histplot = new UMD_plot("histdiv");
let options = {
    width: 500,
    height: 500,
    background:"#a5a5a5", 
    font_size: 12, 
    xgrid: 10,
    xtitle: "Random()",
    ytitle: "Number",
    hist: {
        bins: 20,
        data: xpts,
        xlow: 0,
        xhigh: 1,
        fill: true,
        color: "yellow",
        stats: true
    }
}
histplot.histogram(options);
</script>