function makeEventLineChart()

in source/web_site/js/dash.js [479:545]


    function makeEventLineChart(mtype,items){
        dt = new Date(items[0].EVENTTIMESTAMP);
        //if there are no ticks or if the tick is not already in the array, add it
        if(event_chart_time_ticks.length == 0 || event_chart_time_ticks.indexOf(items[0].EVENTTIMESTAMP)==-1){
            event_chart_time_ticks_display.push(dt.toTimeString().split(' ')[0]);
            event_chart_time_ticks.push(items[0].EVENTTIMESTAMP);
        }
        if(event_chart_time_ticks.length>20){ //cull data over 20 data points
            event_chart_time_ticks.shift();
            event_chart_dataset_labels.shift();
            event_chart_time_ticks_display.shift();
            for(var i=0;i<event_chart_time_ticks.length;i++){
                event_chart_dataset_datas[i].shift();
            }
        }
        //go through each item and if a label already exists for it, add the data to the corresponding datas array
        for(var j=0;j < items.length ;j++)
        {
            var data_index = event_chart_dataset_labels.indexOf(items[j].METRICITEM);
            if (data_index > -1){
                event_chart_dataset_datas[data_index].push(items[j].UNITVALUEINT);
            } else {
                //if the label does not already exist, create an array with nulls for the preceding ticks
                event_chart_dataset_labels.push(items[j].METRICITEM);
                var data = Array(event_chart_time_ticks.length - 1).fill(null);
                data.push(items[j].UNITVALUEINT);
                event_chart_dataset_datas.push(data);

            }
        }
        //go through all the existing labels to see if there was a missing element
        //in this set of items.  If there was set a null in the data for this tick
        for(var j=0;j < event_chart_dataset_labels.length;j++){
            if(!findItem(items,event_chart_dataset_labels[j])) {
                event_chart_dataset_datas[j].push(null);
            }
        }
        //build the data for the chart
        var chart_datasets = [];
        for(var i = 0;i < event_chart_dataset_labels.length;i++){
         chart_datasets.push({ label: event_chart_dataset_labels[i],
            fill: false,
            spanGaps: true,
            backgroundColor: dynamicColors(chart_datasets.length+1),
            borderColor: dynamicColors(chart_datasets.length+1),
            data: event_chart_dataset_datas[i] });
        }
        var elem = document.getElementById(mtype);
        var ctx = elem.getContext("2d");
        elem.chart && elem.chart.destroy();
        var config = {
            type: "line",
            data: {labels: event_chart_time_ticks_display , datasets: chart_datasets },
            options: {
                legend: {
                    position: 'bottom'
                },
                responsive: true,
                scales: {
                    xAxes: [{
                        display: true
                    }]
            }}
        };
        var chart = new Chart(ctx,config);
        elem.chart = chart;
    }