NEW MERGE CSV

by Edsel Matt Morales

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="http://momentjs.com/downloads/moment.js"></script>
<script src="https://jquery-csv.googlecode.com/files/jquery.csv-0.71.min.js"></script>
<div id="forecast" style="width: 800px; height: 450px; margin: 0 auto; border: 2px solid #343434;border-radius:5px"></div>

JavaScript

var serie1 = [];
var serie2 = [];
var BothSeries = [
    [null, null, null]
];
var d = [],
    e = [];

$.get('https://dl.dropboxusercontent.com/u/32420108/WL_FORECAST.CSV', function (data) {
    $.get('https://dl.dropboxusercontent.com/u/32420108/WL_ACTUAL.CSV', function (data1) {
        var lines = data.split('\n');
        var lines1 = data1.split('\n');

        $.each(lines1, function (lineNo, line) {
            var items = line.split(',');
            if (lineNo > 0) {
                serie1.push([items[0], parseFloat(items[1])])
            }
        });
        $.each(lines, function (lineNo, line) {
            var items = line.split(',');
            if (lineNo > 0) {
                serie2.push([items[0], parseFloat(items[1])])
            }
        });
        merge(serie1, serie2);
        //console.log(BothSeries)
        for (i = 1; i < BothSeries.length; i++) {
            var t = BothSeries[i][0];
            var getVal = parseFloat(BothSeries[i][1]);
            var getVal2 = parseFloat(BothSeries[i][2]);

            console.log(t+' :'+getVal+ ' //' +getVal2);
        }
        $("#forecast").highcharts({
            title: {
                text: "Forecasted ",
                x: -20
            },
            subtitle: {
                text: "Source:CSU Phil-LiDAR 1",
                x: -20
            },
            chart: {
                type: "line",
                stacking: !0
            },
            credits: {
                enabled: !1
            },
            xAxis: {
                type: "category",
                minTickInterval: 60,
                TickInterval: 30,
                tickmarkPlacement: "on",
                labels: {
                    padding: 20,
                    align: "center",
                    style: {
                        fontSize: "10px"
                    }
                }
            },
            yAxis: [{
                title: {
                    text: "Water Level,m"
        ...