개요

사진

샘플 코드

function run() {
    var objs = [];
    var src = document.getElementById('src');
    var lines = src.value.split('\n');
    for (var i = 0; i < lines.length - 1; i++)
    {   
        var line = lines[i].split(';');
        switch (line[0])
        {
        case 'STR':
            objs.push({
                mountpoint: line[1], 
                identifier: line[2],
                format: line[3],
                format_details: line[4],
                carrier: line[5],
                nav_system: line[6],
                network: line[7],
                country: line[8],
                latitude: line[9],
                longitude: line[10],
                nmea: line[11],
                solution: line[12],
                generator: line[13],
                compression: line[14],
                authentication: line[15],
                bitrate: line[16],
                misc: line[17]
            });

        case 'CAS':

        case 'NET':

        default:

        }
    }
    var table = d3.select("body").insert("table", ":first-child");
    var thead = table.append("thead");
    var tbody = table.append("tbody");
    thead.append("tr").selectAll("th").data(d3.entries(objs[0])).enter().append("th").on("click", function(d, i) {
        createTableBody(d.key);
    }).text(function(d) {
        return d.key;
    });
    createTableBody("id");
    function createTableBody(sortKey) {
        objs.sort(function(x, y) {
            return d3.descending(x[sortKey], y[sortKey]);
        });
        tbody.selectAll("tr").data(objs).enter().append("tr").selectAll("td").data(function(d) {
            return d3.entries(d);
        }).enter().append("td").text(function(d) {
            return d.value;
        });
        tbody.selectAll("tr").data(objs).selectAll("td").data(function(d) {
            return d3.entries(d);
        }).text(function(d) {
            return d.value;
        });
    }   
}

아티팩트