JSFiddle - React, Tailwind, and code Playground

by Chris Hughes

JavaScript

//Sets the icons for the menu buttons (info)
$(function () {
    $("button:first").button({
        icons: {
            primary: "ui-icon-info" //ui-icon-info
        },
        text: false
    });
});


//Sets characteristics for fancyBox
$(document).ready(function () {
    $('.fancybox').fancybox({
        padding: 10,
            'height': 300,
            'width': 1000,
            'autoSize': true,
        closeClick: true,
        closeBtn: true,
        helpers: {
            title: {
                type: 'inside'
            }
            //  buttons: {}
        }
    });
});


function getStationData(station_code) {

    //Reading the Year from the File
    $.getJSON('WATER_LEVELS/read_climate_file.php?test_variable=0&station_code=' + station_code, function (data) {
        the_results1 = data[0];
        the_results2 = data[1];
        the_results3 = data[2];
        the_results4 = data[3];
        the_results5 = data[4];
    });
    the_year = the_results1;
    the_month = the_results2;
    the_day = the_results3;
    the_time = the_results4;
    water_level = the_results5;

    for (var ii = 0; ii < the_year.length; ii++) {
        the_year[ii] = +the_year[ii];
        the_month[ii] = +the_month[ii];
        the_day[ii] = +the_day[ii];
        water_level[ii] = +water_level[ii];
    }


    //Initializing Variables
    the_hour = [];
    the_minute = [];

    //Creating Hour and Minute variables from the Time variable
    for (ii = 0; ii < water_level.length - 5; ii++) {
        temp_time = the_time[ii];
        res = temp_time.split(":");
        the_hour[ii] = res[0];
        the_minute[ii] = res[1];
    }

    return [the_year, the_month, the_day, the_hour, the_minute, water_level];
}


function createSeries(the_year, the_month, the_day, the_hour, the_minute, water_level) {

    the_date = [];
    the_data_points = [];

    //Creating the time series pair: [UTC.time, Water-Level]
    for (ii = 0; ii < water_level.length - 5; ii++) {
       ...