HChart - Test kiwis request v1.5

Query a kiwis v1.5 timeseries

by Bryan McIntosh

HTML

<script src="http://code.highcharts.com/stock/highstock.js"></script>
<button id="btnAddGRCA1">Add TS1</button>
<button id="btnAddGRCA2">Add TS2</button>
<button id="btnClear">Clear Table</button>
<div id="ChartContainer" style="height: 400px"></div>

JavaScript

var seriesFull = [];

function makeData(tsURL, tsName) {
    //Ajax query for data, JSON format
    $.getJSON(tsURL, function (data) {
        var data2 = data[0].data;
        var data3 = [];
        //Loop through date and param values and format for chart
        for (var i = 1; i < data2.length; i++) {
            var myDate = new Date(data2[i][0].substring(0, 23));
            var result = myDate.getTime();
            data2[i][0] = result;
            data2[i][1] = parseFloat(data2[i][1]);
            data3.push(data2[i]);
        }
        
        //populate the series for the chart
        var singleSeries = {
            _colorIndex: seriesFull.length,
            _symbolIndex: seriesFull.length,
            //Can also extract name directly from query, but lazy example
            name: tsName,
            data: data3
        };
        seriesFull.push(singleSeries);
        
        //Create and render the chart passing in the series
        createMyChart2(seriesFull);
    });
}

$("#btnAddGRCA1").click(function () {
        makeData("https://waterdata.grandriver.ca//KiWIS/KiWIS?service=kisters&type=queryServices&request=getTimeseriesValues&datasource=0&ts_id=8629042&from=2015-02-02&to=2015-03-13&format=json", "TS1");
});
$("#btnAddGRCA2").click(function () {
        makeData("https://waterdata.grandriver.ca//KiWIS/KiWIS?service=kisters&type=queryServices&request=getTimeseriesValues&datasource=0&ts_id=8647042&from=2015-02-02&to=2015-03-13&format=json", "TS2");
});

$("#btnClear").click(function () {
    seriesFull.length = 0;
    var dataReset = [];
    $("#ChartContainer").html("");
});

function createMyChart2(dataSeries) {
    var chart = new Highcharts.StockChart({
        chart: {renderTo: 'ChartContainer'},
        legend: {enabled: true},
        rangeSelector: {selected: 1},
        title: {text: 'Station values - Around the World'},
        series: dataSeries,
        xAxis: {ordinal: false},
        tooltip: {valueDecimals: 2,shared: true}
  ...