Chart

by XcsN

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src=""></script>

<div id="Chart">

</div>

<button id="bt">
click
</button>

JavaScript

$(document).ready(function () {
  $('#bt').click(function () {
    draw();
  });
});

function chart(arreglo, arreglo2, arreglo3, arreglo4) {
    $('#Chart').highcharts({
        title: {
            text: 'Inspeccion Dimensional'
        },
        xAxis: {
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Resultados'
            }
        },
        legend: {
            reversed: true
        },
        plotOptions: {
            series: {
        //        stacking: 'normal'
            }
        },
        series: [{
            name: 'Diameter',
            data: arreglo4.map(function (value) {
                return Number(value);
            })
        }, {
            name: 'Length',
            data: arreglo3.map(function (value) {
                return Number(value);
            })
        }, {
            name: 'Width',
            data: arreglo2.map(function (value) {
                return Number(value);
            })
        }, {
            name: 'Thickness',
            data: arreglo.map(function (value) {
                return Number(value);
            })
        }]
    });
}

function draw() {
  array4 = [4, 8, 13, 17, 21];
  array3 = [3, 7, 12, 16, 20];
  array2 = [2, 6, 11, 15, 19];
  array1 = [1, 5, 9, 14, 18];
  
  chart(array1, array2, array3, array4);
}