月毎や年毎で見比べる forked: Dygraphの練習

jsdoit.html

<script src="http://dygraphs.com/1.0.1/dygraph-combined.js"></script>

<div id="graphdiv"></div>
<div id="graphdiv_m"></div>
<div id="graphdiv_y"></div>

jsdoit.js

// forked from Akiyah's "Dygraphの練習" http://jsdo.it/Akiyah/fk0x
var container = document.getElementById("graphdiv");
var g = new Dygraph(container,"http://jsrun.it/assets/r/N/6/D/rN6DT", {
    labels: ['date', 'Temperature'],
    ylabel: 'Temperature (C)'
});

function normalize_m(csv) {
    var list = {};
    var lines = csv.split("\n");
    for (var i = 1; i < lines.length; i++) {
        var words = lines[i].split("\t");
        if (words.length >= 2) {
            var d = new Date(words[0]);
            var temperature = words[1];
            if (2013 <= d.getFullYear()) {
                var name = d.getFullYear() + "-" + (d.getMonth() + 1);
                if (!list[name]) {
                    list[name] = [];
                }
                list[name][d.getDate()] = temperature;
            }
        }
    }
     
    var names = []
    for (var key in list) {
        names.push(key);
    }
    
    var normal_csv = "days," + names.join(",") + "\n";
        
    for (var d = 1; d <= 31; d++) {
        var values = [] 
        for (var key in list) {
            values.push(list[key][d]) 
        }
        normal_csv += d + "," + values.join(",") + "\n"    
    }

    return normal_csv;
}


function normalize_y(csv) {
    var list = {};
    var lines = csv.split("\n");
    for (var i = 1; i < lines.length; i++) {
        var words = lines[i].split("\t");
        if (words.length >= 2) {
            var d = new Date(words[0]);
            var v = words[1];
            var year = d.getFullYear();
            var month = d.getMonth() + 1;
            var date = d.getDate();
            var first = new Date(year, 0, 1); // 年始
            var diffDay = (d - first) / (24*60*60*1000);
            console.log(diffDay);
            var name = year;
            if (!list[name]) {
                list[name] = [];
            }
            list[name][diffDay] = v;
        }
    }
     
    var names = []
    for (var key in list) {
        names.push(key);
    }
    
    var normal_csv = "days," + names.join(",") + "\n";
        
    for (var d = 1; d <= 365; d++) {
        var values = [] 
        for (var key in list) {
            values.push(list[key][d]) 
        }
        normal_csv += d + "," + values.join(",") + "\n"    
    }

    return normal_csv;
}

$(function() {
    $.get(
        "http://jsrun.it/assets/r/N/6/D/rN6DT",
        function(data) {
            // month
            var csv = normalize_m(data);
            console.log(csv);
            var container = document.getElementById("graphdiv_m");
            var g = new Dygraph(container, csv, {
                labelsSeparateLines: true, // ラベルの後ろに改行挟む
                highlightSeriesOpts: {  // ハイライトの設定
                    strokeWidth: 3,
                    strokeBorderWidth: 1,
                    highlightCircleSize: 5
                }
            });
            
            // year
            var csv = normalize_y(data);
            var container = document.getElementById("graphdiv_y");
            var g = new Dygraph(container, csv, {
                labelsSeparateLines: true, // ラベルの後ろに改行挟む
                highlightSeriesOpts: {  // ハイライトの設定
                    strokeWidth: 3,
                    strokeBorderWidth: 1,
                    highlightCircleSize: 5
                }
            });
            

        }
    );
});