jalapic/README.md

## README.md

      
    Raw
  

              README.md
            
          
    Built with blockbuilder.org
Working through the book Getting Started with D3
forked from jfost00's block: Subway Wait Assessment

  
## index.html
<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
  <link rel="stylesheet" type="text/css" href="styles.css">
  <script>

    var time_scale;
    var percent_scale;

    function get_timeseries_data(d,i){
        // get the id of the current element
        var id = d.line_id
        // see if we have an associated time series
        var ts = d3.select('#'+id)
        // toggle
        if (ts.empty()){
            d3.json('subway_wait.json', function(data){
                filtered_data = data.filter(function(d){return d.line_id === id})
                draw_timeseries(filtered_data, id)
            })
        } else {
            ts.remove()
        }
    }

    function add_label(circle, d, i){
        d3.select(circle)
            .transition()
            .attr('r', 9)

        d3.select('#' + d.line_id).append('text')
            .text(d.line_id.split('_')[1])
            .attr('text-anchor','middle')
            .style("dominant-baseline","central")
            .attr('x', time_scale(d.time))
            .attr('y', percent_scale(d.late_percent))
            .attr('class','linelabel')
            .style('opacity',0)
            .style('fill','white')
            .transition()
                .style('opacity',1)
    }

    function draw_timeseries(data, id){

        var line = d3.svg.line()
            .x(function(d){return time_scale(d.time)})
            .y(function(d){return percent_scale(d.late_percent)})
            .interpolate("linear")

        var g = d3.select('#chart')
            .append('g')
            .attr('id', id)
            .attr('class', 'timeseries ' + id)

        g.append('path')
            .attr('d', line(data))

        g.selectAll('circle')
            .data(data)
            .enter()
            .append("circle")
            .attr('cx', function(d) {return time_scale(d.time)})
            .attr('cy', function(d) {return percent_scale(d.late_percent)})
            .attr('r',0)

        var enter_duration = 1000;

        g.selectAll('circle')
            .transition()
            .delay(function(d, i) { return i / data.length * enter_duration; })
            .attr('r', 5)
            .each('end',function(d,i){
                if (i === data.length-1){
                    add_label(this,d)
                }
            })


        g.selectAll('circle')
            .on('mouseover', function(d){
                d3.select(this)
                    .transition().attr('r', 9)
            })
            .on('mouseout', function(d,i){
                if (i !== data.length-1) {
                    d3.select(this).transition().attr('r', 5)
                }
            })

        g.selectAll('circle')
            .on('mouseover.tooltip', function(d){
                d3.select("text." + d.line_id).remove()
                d3.select('#chart')
                    .append('text')
                    .text(d.late_percent + "%")
                    .attr('x', time_scale(d.time) + 10)
                    .attr('y', percent_scale(d.late_percent) - 10)
                    .attr('class', d.line_id)
            })
            .on('mouseout.tooltip', function(d){
                d3.select("text." + d.line_id)
                    .transition()
                    .duration(500)
                    .style('opacity',0)
                    .attr('transform','translate(10, -10)')
                    .remove()
            })
    }


    function draw(data) {
        "use strict";

        // set up the viewport, the scales, and axis generators

        var container_dimensions = {width: 700, height: 400},
            margins = {top: 10, right: 20, bottom: 30, left: 60},
            chart_dimensions = {
                width: container_dimensions.width - margins.left - margins.right,
                height: container_dimensions.height - margins.top - margins.bottom
            };

        time_scale = d3.time.scale()
            .range([0, chart_dimensions.width])
            .domain([1230789600000, 1301634000000]);

        percent_scale = d3.scale.linear()
            .range([chart_dimensions.height, 0])
            .domain([65, 90]);

        var time_axis = d3.svg.axis()
            .scale(time_scale)

        var count_axis = d3.svg.axis()
            .scale(percent_scale)
            .orient("left");

        // draw axes

        var g = d3.select('#timeseries')
          .append('svg')
            .attr("width", container_dimensions.width)
            .attr("height", container_dimensions.height)
          .append("g")
            .attr("transform", "translate(" + margins.left + "," + margins.top + ")")
            .attr("id","chart");

        g.append("g")
          .attr("class", "x axis")
          .attr("transform", "translate(0," + chart_dimensions.height + ")")
          .call(time_axis);

        g.append("g")
          .attr("class", "y axis")
          .call(count_axis);

      // draw the y-axis label

        d3.select('.y.axis')
            .append('text')
            .text('percent on time')
            .attr('transform', "rotate (-270, 0, 0)")
            .attr('x', 100)
            .attr('y', 50);

        // draw the key

        var key_items = d3.select('#key')
          .selectAll('div')
          .data(data)
          .enter()
          .append('div')
            .attr('class','key_line')
            .attr('id',function(d){return d.line_id+"_key"})

        key_items.append('div')
            .attr('id', function(d){return 'key_square_' + d.line_id})
            .attr('class', function(d){return 'key_square ' + d.line_id})

        key_items.append('div')
            .attr('class','key_label')
            .text(function(d){return d.line_name})

        d3.selectAll('.key_line')
            .on('click', get_timeseries_data)

    }
  </script>
</head>

<body>
  <div id = "timeseries"></div>
  <div id = "key"></div>
  <script>
    d3.json("subway_wait_mean.json", draw);
  </script>
</body>

## styles.css
body{
        font-family:sans-serif;
    }
    .axis path, line{
        stroke:black;
    }
    .timeseries path{
        stroke-width:3px;
    }
    .timeseries circle{
        stroke: white;
    }
    .timeseries text{
        fill: white;
        stroke: none;
        font-size:12px;
        font-weight: bold;
    }
    .line {
        float:left;
    }
    .line_container{
        width: 150px;
        height: 20px;
    }
    path{
        fill: none;
    }
    .key{
        float:right;
    }
    .key_line{
        font-size:17px;
        width:100%;
    }
    .key_square{
        height:10px;
        width:10px;
        outline:solid 1px black;
        float:left;
        margin-right:10px;
        margin-top:6px;
        margin-left:10px;
    }
    #timeseries{
        float:left;
    }
    .Line_A, .Line_C, .Line_E{
    stroke:#2850AD;
    fill:#2850AD;
    background-color:#2850AD;
}
.Line_B, .Line_D, .Line_F, .Line_M {
    stroke:#FF6319;
    fill:#FF6319;
    background-color:#FF6319;
}
.Line_G {
    stroke:#6CBE45;
    fill:#6CBE45;
    background-color:#6CBE45;
}
.Line_Z_J {
    stroke:#996633;
    fill:#996633;
    background-color:#996633;
}
.Line_L {
    stroke:#A7A9AC;
    fill:#A7A9AC;
    background-color:#A7A9AC;
}
.Line_N, .Line_Q, .Line_R {
    stroke:#FCCC0A;
    fill:#FCCC0A;
    background-color:#FCCC0A;
}
.Line_S {
    stroke:#808183;
    fill:#808183;
    background-color:#808183;
}
.Line_1, .Line_2, .Line_3{
    stroke:#EE352E;
    fill:#EE352E;
    background-color:#EE352E;
}
.Line_4, .Line_5, .Line_6{
    stroke:#00933C;
    fill:#00933C;
    background-color:#00933C;
}
.Line_7 {
    stroke:#B933AD;
    fill:#B933AD;
    background-color:#B933AD;
}

## subway_wait.json
[
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 73.1,
"time": 1230786000000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 73.1,
"time": 1233464400000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 73,
"time": 1235883600000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 73.9,
"time": 1238558400000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 74.1,
"time": 1241150400000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 74.2,
"time": 1243828800000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 74.4,
"time": 1246420800000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 75.2,
"time": 1249099200000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 75.6,
"time": 1251777600000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 75.5,
"time": 1254369600000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 76,
"time": 1257048000000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 76.3,
"time": 1259643600000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 76.5,
"time": 1262322000000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 77.1,
"time": 1265000400000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 77.1,
"time": 1267419600000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 76.9,
"time": 1270094400000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 76.9,
"time": 1272686400000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 77.3,
"time": 1275364800000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 75.3,
"time": 1277956800000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 75.6,
"time": 1280635200000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 74.6,
"time": 1283313600000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 73.9,
"time": 1288584000000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 75.9,
"time": 1293858000000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 77.3,
"time": 1296536400000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 78.3,
"time": 1298955600000
},
{
"line_id": "Line_1",
"line_name": "1 Line",
"late_percent": 78.6,
"time": 1301630400000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 71.8,
"time": 1230786000000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 71.9,
"time": 1233464400000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 72.3,
"time": 1235883600000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 72.8,
"time": 1238558400000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 72.9,
"time": 1241150400000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 72.2,
"time": 1243828800000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 73.2,
"time": 1246420800000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 73.5,
"time": 1249099200000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 73.9,
"time": 1251777600000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 74.2,
"time": 1254369600000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 74.3,
"time": 1257048000000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 74.3,
"time": 1259643600000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 74.2,
"time": 1262322000000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 73.9,
"time": 1265000400000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 74.1,
"time": 1267419600000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 73.9,
"time": 1270094400000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 74.4,
"time": 1272686400000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 74.3,
"time": 1275364800000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 71.8,
"time": 1277956800000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 71.7,
"time": 1280635200000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 72.4,
"time": 1283313600000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 71.7,
"time": 1288584000000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 69.6,
"time": 1293858000000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 71.9,
"time": 1296536400000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 72.4,
"time": 1298955600000
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"late_percent": 73.8,
"time": 1301630400000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 74.3,
"time": 1230786000000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 74.8,
"time": 1233464400000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 75.4,
"time": 1235883600000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 76.1,
"time": 1238558400000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 76,
"time": 1241150400000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 76,
"time": 1243828800000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 76.6,
"time": 1246420800000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 76.4,
"time": 1249099200000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 76.9,
"time": 1251777600000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 77.6,
"time": 1254369600000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 77.5,
"time": 1257048000000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 77.2,
"time": 1259643600000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 77.8,
"time": 1262322000000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 78.2,
"time": 1265000400000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 77.8,
"time": 1267419600000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 77.7,
"time": 1270094400000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 77.6,
"time": 1272686400000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 77.9,
"time": 1275364800000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 77.1,
"time": 1277956800000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 77.1,
"time": 1280635200000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 76,
"time": 1283313600000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 77.7,
"time": 1288584000000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 75.1,
"time": 1293858000000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 76.3,
"time": 1296536400000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 76.1,
"time": 1298955600000
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"late_percent": 77.1,
"time": 1301630400000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 68.4,
"time": 1230786000000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 68.3,
"time": 1233464400000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 67.9,
"time": 1235883600000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 68.3,
"time": 1238558400000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 68.7,
"time": 1241150400000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 68.8,
"time": 1243828800000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 69,
"time": 1246420800000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 69.5,
"time": 1249099200000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 70.1,
"time": 1251777600000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 70.6,
"time": 1254369600000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 70.9,
"time": 1257048000000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 71.4,
"time": 1259643600000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 72,
"time": 1262322000000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 72.8,
"time": 1265000400000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 74,
"time": 1267419600000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 74.5,
"time": 1270094400000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 75.1,
"time": 1272686400000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 74.6,
"time": 1275364800000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 72.7,
"time": 1277956800000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 73.4,
"time": 1280635200000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 74.4,
"time": 1283313600000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 73.7,
"time": 1288584000000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 70.1,
"time": 1293858000000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 72,
"time": 1296536400000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 72.9,
"time": 1298955600000
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"late_percent": 72.2,
"time": 1301630400000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 70.6,
"time": 1230786000000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 70.4,
"time": 1233464400000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 70.4,
"time": 1235883600000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 70.6,
"time": 1238558400000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 70.5,
"time": 1241150400000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 70.9,
"time": 1243828800000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 72.2,
"time": 1246420800000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 72.1,
"time": 1249099200000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 71.8,
"time": 1251777600000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 71.3,
"time": 1254369600000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 71.6,
"time": 1257048000000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 71.6,
"time": 1259643600000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 71,
"time": 1262322000000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 71.6,
"time": 1265000400000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 71.9,
"time": 1267419600000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 71.7,
"time": 1270094400000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 72.4,
"time": 1272686400000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 72.2,
"time": 1275364800000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 72,
"time": 1277956800000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 71.9,
"time": 1280635200000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 71.9,
"time": 1283313600000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 71.9,
"time": 1288584000000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 67.2,
"time": 1293858000000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 71.5,
"time": 1296536400000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 71.4,
"time": 1298955600000
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"late_percent": 70.3,
"time": 1301630400000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 71.4,
"time": 1230786000000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 71.7,
"time": 1233464400000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 72.1,
"time": 1235883600000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 72.5,
"time": 1238558400000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 73.1,
"time": 1241150400000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 72.9,
"time": 1243828800000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 73,
"time": 1246420800000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 73.2,
"time": 1249099200000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 74,
"time": 1251777600000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 74.1,
"time": 1254369600000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 73.3,
"time": 1257048000000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 73,
"time": 1259643600000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 73.2,
"time": 1262322000000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 73.1,
"time": 1265000400000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 73.2,
"time": 1267419600000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 73.4,
"time": 1270094400000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 73.2,
"time": 1272686400000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 73.5,
"time": 1275364800000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 73.3,
"time": 1277956800000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 74.6,
"time": 1280635200000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 75.5,
"time": 1283313600000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 78.5,
"time": 1288584000000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 65.8,
"time": 1293858000000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 74.4,
"time": 1296536400000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 76.9,
"time": 1298955600000
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"late_percent": 75.5,
"time": 1301630400000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.5,
"time": 1230786000000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.4,
"time": 1233464400000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.4,
"time": 1235883600000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.3,
"time": 1238558400000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.8,
"time": 1241150400000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.9,
"time": 1243828800000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.9,
"time": 1246420800000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 76.1,
"time": 1249099200000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 75.8,
"time": 1251777600000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 75.8,
"time": 1254369600000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 76.1,
"time": 1257048000000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 76.1,
"time": 1259643600000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 76.1,
"time": 1262322000000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 76.2,
"time": 1265000400000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 75.7,
"time": 1267419600000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 75.6,
"time": 1270094400000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 75.4,
"time": 1272686400000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.6,
"time": 1275364800000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.4,
"time": 1277956800000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.2,
"time": 1280635200000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.1,
"time": 1283313600000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.2,
"time": 1288584000000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.3,
"time": 1293858000000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.4,
"time": 1296536400000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 74.7,
"time": 1298955600000
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"late_percent": 75,
"time": 1301630400000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.4,
"time": 1230786000000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.2,
"time": 1233464400000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.3,
"time": 1235883600000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.2,
"time": 1238558400000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71,
"time": 1241150400000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.2,
"time": 1243828800000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71,
"time": 1246420800000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.1,
"time": 1249099200000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.1,
"time": 1251777600000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.2,
"time": 1254369600000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 70.9,
"time": 1257048000000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 70.6,
"time": 1259643600000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 70.7,
"time": 1262322000000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.2,
"time": 1265000400000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71,
"time": 1267419600000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.3,
"time": 1270094400000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.5,
"time": 1272686400000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.4,
"time": 1275364800000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.2,
"time": 1277956800000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71,
"time": 1280635200000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71,
"time": 1283313600000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 71.7,
"time": 1288584000000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 72.1,
"time": 1293858000000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 72.4,
"time": 1296536400000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 72.8,
"time": 1298955600000
},
{
"line_id": "Line_A",
"line_name": "A Line",
"late_percent": 72.5,
"time": 1301630400000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 76.5,
"time": 1230786000000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 76.8,
"time": 1233464400000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 76.5,
"time": 1235883600000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 76.4,
"time": 1238558400000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 77.2,
"time": 1241150400000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 77.4,
"time": 1243828800000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 78,
"time": 1246420800000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 78,
"time": 1249099200000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 78,
"time": 1251777600000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 78.1,
"time": 1254369600000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 77.9,
"time": 1257048000000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 78.1,
"time": 1259643600000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 78.2,
"time": 1262322000000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 78,
"time": 1265000400000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 78.2,
"time": 1267419600000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 78.2,
"time": 1270094400000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 77.8,
"time": 1272686400000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 77.5,
"time": 1275364800000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 77.8,
"time": 1277956800000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 77.6,
"time": 1280635200000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 77.3,
"time": 1283313600000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 77.2,
"time": 1288584000000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 78,
"time": 1293858000000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 78,
"time": 1296536400000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 77.6,
"time": 1298955600000
},
{
"line_id": "Line_B",
"line_name": "B Line",
"late_percent": 77.9,
"time": 1301630400000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 78.1,
"time": 1230786000000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 77.7,
"time": 1233464400000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 78.6,
"time": 1235883600000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 78.8,
"time": 1238558400000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 79.3,
"time": 1241150400000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 78.7,
"time": 1243828800000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 79,
"time": 1246420800000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 78.7,
"time": 1249099200000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 78.9,
"time": 1251777600000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 78.7,
"time": 1254369600000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 78.6,
"time": 1257048000000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 78.8,
"time": 1259643600000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 78.9,
"time": 1262322000000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 79.7,
"time": 1265000400000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 79.6,
"time": 1267419600000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 79.6,
"time": 1270094400000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 79.7,
"time": 1272686400000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 80.6,
"time": 1275364800000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 80.3,
"time": 1277956800000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 80.4,
"time": 1280635200000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 80.4,
"time": 1283313600000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 81.2,
"time": 1288584000000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 81.6,
"time": 1293858000000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 81.4,
"time": 1296536400000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 81.2,
"time": 1298955600000
},
{
"line_id": "Line_C",
"line_name": "C Line",
"late_percent": 81.4,
"time": 1301630400000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 78,
"time": 1230786000000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 77.9,
"time": 1233464400000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 78.8,
"time": 1235883600000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 79,
"time": 1238558400000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 79.5,
"time": 1241150400000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 80.1,
"time": 1243828800000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 80.1,
"time": 1246420800000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 80.6,
"time": 1249099200000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 80.5,
"time": 1251777600000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 80.5,
"time": 1254369600000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 80.8,
"time": 1257048000000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 80.6,
"time": 1259643600000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 80.4,
"time": 1262322000000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 80.6,
"time": 1265000400000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 80.3,
"time": 1267419600000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 80.4,
"time": 1270094400000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 79.7,
"time": 1272686400000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 79.3,
"time": 1275364800000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 79.5,
"time": 1277956800000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 79,
"time": 1280635200000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 79.4,
"time": 1283313600000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 79.4,
"time": 1288584000000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 79.8,
"time": 1293858000000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 79.8,
"time": 1296536400000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 79.8,
"time": 1298955600000
},
{
"line_id": "Line_D",
"line_name": "D Line",
"late_percent": 79.7,
"time": 1301630400000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 71.6,
"time": 1230786000000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 71.1,
"time": 1233464400000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 70.9,
"time": 1235883600000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 70.9,
"time": 1238558400000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 70.7,
"time": 1241150400000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 71.4,
"time": 1243828800000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 72,
"time": 1246420800000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 72.3,
"time": 1249099200000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 72.5,
"time": 1251777600000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 73.9,
"time": 1254369600000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 74,
"time": 1257048000000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 74,
"time": 1259643600000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 74.3,
"time": 1262322000000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 74.7,
"time": 1265000400000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 75.3,
"time": 1267419600000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 75.6,
"time": 1270094400000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 75.8,
"time": 1272686400000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 75.9,
"time": 1275364800000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 75.7,
"time": 1277956800000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 75.8,
"time": 1280635200000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 75.9,
"time": 1283313600000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 75.4,
"time": 1288584000000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 76,
"time": 1293858000000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 75.8,
"time": 1296536400000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 75.3,
"time": 1298955600000
},
{
"line_id": "Line_E",
"line_name": "E Line",
"late_percent": 75.4,
"time": 1301630400000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 69.3,
"time": 1230786000000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 68.8,
"time": 1233464400000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 68.7,
"time": 1235883600000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 68.8,
"time": 1238558400000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 68.8,
"time": 1241150400000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 69.4,
"time": 1243828800000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 69.2,
"time": 1246420800000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 69.1,
"time": 1249099200000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 69.7,
"time": 1251777600000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 70,
"time": 1254369600000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 69.9,
"time": 1257048000000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 70.1,
"time": 1259643600000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 69.9,
"time": 1262322000000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 70.4,
"time": 1265000400000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 70.6,
"time": 1267419600000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 70.5,
"time": 1270094400000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 71.3,
"time": 1272686400000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 71.6,
"time": 1275364800000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 72,
"time": 1277956800000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 72.3,
"time": 1280635200000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 71.7,
"time": 1283313600000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 72.7,
"time": 1288584000000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 73.2,
"time": 1293858000000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 72.6,
"time": 1296536400000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 73.3,
"time": 1298955600000
},
{
"line_id": "Line_F",
"line_name": "F Line",
"late_percent": 73.7,
"time": 1301630400000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 79.5,
"time": 1230786000000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 79.2,
"time": 1233464400000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 79.8,
"time": 1235883600000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 80.2,
"time": 1238558400000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 79.9,
"time": 1241150400000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 79.9,
"time": 1243828800000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 79.7,
"time": 1246420800000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 79.3,
"time": 1249099200000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 79.8,
"time": 1251777600000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 80,
"time": 1254369600000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 80.2,
"time": 1257048000000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 80,
"time": 1259643600000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 80.7,
"time": 1262322000000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 81,
"time": 1265000400000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 81.4,
"time": 1267419600000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 81.4,
"time": 1270094400000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 82,
"time": 1272686400000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 82.5,
"time": 1275364800000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 83,
"time": 1277956800000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 83.5,
"time": 1280635200000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 83.2,
"time": 1283313600000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 83.9,
"time": 1288584000000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 84.1,
"time": 1293858000000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 84.3,
"time": 1296536400000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 83.5,
"time": 1298955600000
},
{
"line_id": "Line_G",
"line_name": "G Line",
"late_percent": 83,
"time": 1301630400000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 82.9,
"time": 1230786000000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 83.5,
"time": 1233464400000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 83.8,
"time": 1235883600000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 84.1,
"time": 1238558400000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 84.8,
"time": 1241150400000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 84.8,
"time": 1243828800000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 84.8,
"time": 1246420800000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 85,
"time": 1249099200000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 85.1,
"time": 1251777600000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 85.6,
"time": 1254369600000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 86.1,
"time": 1257048000000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 86,
"time": 1259643600000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 86.3,
"time": 1262322000000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 86.1,
"time": 1265000400000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 86.5,
"time": 1267419600000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 86.1,
"time": 1270094400000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 85.4,
"time": 1272686400000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 85.5,
"time": 1275364800000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 85.9,
"time": 1277956800000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 85.7,
"time": 1280635200000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 85.9,
"time": 1283313600000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 85.4,
"time": 1288584000000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 84.9,
"time": 1293858000000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 84.1,
"time": 1296536400000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 83.5,
"time": 1298955600000
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"late_percent": 83.6,
"time": 1301630400000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 75.1,
"time": 1230786000000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 75.5,
"time": 1233464400000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 75.8,
"time": 1235883600000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 76.3,
"time": 1238558400000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 76.6,
"time": 1241150400000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 76.6,
"time": 1243828800000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 77.1,
"time": 1246420800000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 77.7,
"time": 1249099200000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 78,
"time": 1251777600000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 77.7,
"time": 1254369600000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 78.4,
"time": 1257048000000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 77.8,
"time": 1259643600000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 77.9,
"time": 1262322000000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 77.3,
"time": 1265000400000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 76.9,
"time": 1267419600000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 76.8,
"time": 1270094400000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 76.6,
"time": 1272686400000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 76.4,
"time": 1275364800000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 76.5,
"time": 1277956800000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 76.3,
"time": 1280635200000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 75.8,
"time": 1283313600000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 75.8,
"time": 1288584000000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 77,
"time": 1293858000000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 77.6,
"time": 1296536400000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 78.8,
"time": 1298955600000
},
{
"line_id": "Line_L",
"line_name": "L Line",
"late_percent": 79.1,
"time": 1301630400000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 85.2,
"time": 1230786000000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 85.7,
"time": 1233464400000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 85.7,
"time": 1235883600000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 85.8,
"time": 1238558400000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 85.9,
"time": 1241150400000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 86.1,
"time": 1243828800000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 87.1,
"time": 1246420800000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 87.9,
"time": 1249099200000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 87.9,
"time": 1251777600000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 87.2,
"time": 1254369600000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 87.6,
"time": 1257048000000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 87.7,
"time": 1259643600000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 88,
"time": 1262322000000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 87.8,
"time": 1265000400000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 88,
"time": 1267419600000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 87.5,
"time": 1270094400000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 87.3,
"time": 1272686400000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 87.8,
"time": 1275364800000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 87.3,
"time": 1277956800000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 86.6,
"time": 1280635200000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 84.8,
"time": 1283313600000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 83.1,
"time": 1288584000000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 82.3,
"time": 1293858000000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 82.1,
"time": 1296536400000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 81.4,
"time": 1298955600000
},
{
"line_id": "Line_M",
"line_name": "M Line",
"late_percent": 80.9,
"time": 1301630400000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 78.8,
"time": 1230786000000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 79,
"time": 1233464400000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 79.3,
"time": 1235883600000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 79.4,
"time": 1238558400000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 80,
"time": 1241150400000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 80.4,
"time": 1243828800000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 80.6,
"time": 1246420800000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 81.4,
"time": 1249099200000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 82.1,
"time": 1251777600000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 81.8,
"time": 1254369600000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 82.2,
"time": 1257048000000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 82,
"time": 1259643600000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 82.2,
"time": 1262322000000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 82.4,
"time": 1265000400000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 82.6,
"time": 1267419600000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 82.7,
"time": 1270094400000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 81.9,
"time": 1272686400000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 81.4,
"time": 1275364800000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 81.2,
"time": 1277956800000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 80.4,
"time": 1280635200000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 79.3,
"time": 1283313600000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 78.8,
"time": 1288584000000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 77.5,
"time": 1293858000000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 77,
"time": 1296536400000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 76.3,
"time": 1298955600000
},
{
"line_id": "Line_N",
"line_name": "N Line",
"late_percent": 76.1,
"time": 1301630400000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 81.8,
"time": 1230786000000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 82.3,
"time": 1233464400000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 82.2,
"time": 1235883600000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 82.5,
"time": 1238558400000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 83,
"time": 1241150400000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 82.8,
"time": 1243828800000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 83.1,
"time": 1246420800000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 83,
"time": 1249099200000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 82.9,
"time": 1251777600000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 82.9,
"time": 1254369600000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 83.3,
"time": 1257048000000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 82.8,
"time": 1259643600000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 82.8,
"time": 1262322000000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 82.2,
"time": 1265000400000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 82.2,
"time": 1267419600000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 82.1,
"time": 1270094400000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 81.6,
"time": 1272686400000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 81.6,
"time": 1275364800000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 81.4,
"time": 1277956800000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 81,
"time": 1280635200000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 80.1,
"time": 1283313600000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 79,
"time": 1288584000000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 78.8,
"time": 1293858000000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 78.6,
"time": 1296536400000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 78.3,
"time": 1298955600000
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"late_percent": 77.9,
"time": 1301630400000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 75.7,
"time": 1230786000000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 76.1,
"time": 1233464400000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 76.5,
"time": 1235883600000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 76.5,
"time": 1238558400000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 76.7,
"time": 1241150400000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 76.6,
"time": 1243828800000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 76.7,
"time": 1246420800000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 76.7,
"time": 1249099200000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 76.9,
"time": 1251777600000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 77.5,
"time": 1254369600000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 78.1,
"time": 1257048000000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 78,
"time": 1259643600000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 78,
"time": 1262322000000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 77.8,
"time": 1265000400000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 77.6,
"time": 1267419600000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 77.7,
"time": 1270094400000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 77.8,
"time": 1272686400000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 78.1,
"time": 1275364800000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 78,
"time": 1277956800000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 78.2,
"time": 1280635200000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 78.6,
"time": 1283313600000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 78.3,
"time": 1288584000000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 78,
"time": 1293858000000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 78.1,
"time": 1296536400000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 78.6,
"time": 1298955600000
},
{
"line_id": "Line_R",
"line_name": "R Line",
"late_percent": 78.6,
"time": 1301630400000
}
]

## subway_wait_mean.json
[
{
"line_id": "Line_1",
"line_name": "1 Line",
"mean": 75.60384615384615
},
{
"line_id": "Line_2",
"line_name": "2 Line",
"mean": 72.97692307692309
},
{
"line_id": "Line_3",
"line_name": "3 Line",
"mean": 76.70384615384613
},
{
"line_id": "Line_4",
"line_name": "4 Line",
"mean": 71.39615384615385
},
{
"line_id": "Line_5",
"line_name": "5 Line",
"mean": 71.26538461538463
},
{
"line_id": "Line_6",
"line_name": "6 Line",
"mean": 73.4
},
{
"line_id": "Line_7",
"line_name": "7 Line",
"mean": 75.03846153846155
},
{
"line_id": "Line_A",
"line_name": "A Line",
"mean": 71.34615384615385
},
{
"line_id": "Line_B",
"line_name": "B Line",
"mean": 77.62307692307692
},
{
"line_id": "Line_C",
"line_name": "C Line",
"mean": 79.61153846153846
},
{
"line_id": "Line_D",
"line_name": "D Line",
"mean": 79.75
},
{
"line_id": "Line_E",
"line_name": "E Line",
"mean": 73.93076923076923
},
{
"line_id": "Line_F",
"line_name": "F Line",
"mean": 70.67692307692307
},
{
"line_id": "Line_G",
"line_name": "G Line",
"mean": 81.34615384615384
},
{
"line_id": "Line_Z_J",
"line_name": "J Z Line",
"mean": 85.05384615384615
},
{
"line_id": "Line_L",
"line_name": "L Line",
"mean": 76.97692307692306
},
{
"line_id": "Line_M",
"line_name": "M Line",
"mean": 85.94999999999999
},
{
"line_id": "Line_N",
"line_name": "N Line",
"mean": 80.26153846153846
},
{
"line_id": "Line_Q",
"line_name": "Q Line",
"mean": 81.54615384615383
},
{
"line_id": "Line_R",
"line_name": "R Line",
"mean": 77.5153846153846
}
]
	<!DOCTYPE html>
	<head>
	<meta charset="utf-8">
	<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
	<link rel="stylesheet" type="text/css" href="styles.css">
	<script>

	var time_scale;
	var percent_scale;

	function get_timeseries_data(d,i){
	// get the id of the current element
	var id = d.line_id
	// see if we have an associated time series
	var ts = d3.select('#'+id)
	// toggle
	if (ts.empty()){
	d3.json('subway_wait.json', function(data){
	filtered_data = data.filter(function(d){return d.line_id === id})
	draw_timeseries(filtered_data, id)
	})
	} else {
	ts.remove()
	}
	}

	function add_label(circle, d, i){
	d3.select(circle)
	.transition()
	.attr('r', 9)

	d3.select('#' + d.line_id).append('text')
	.text(d.line_id.split('_')[1])
	.attr('text-anchor','middle')
	.style("dominant-baseline","central")
	.attr('x', time_scale(d.time))
	.attr('y', percent_scale(d.late_percent))
	.attr('class','linelabel')
	.style('opacity',0)
	.style('fill','white')
	.transition()
	.style('opacity',1)
	}

	function draw_timeseries(data, id){

	var line = d3.svg.line()
	.x(function(d){return time_scale(d.time)})
	.y(function(d){return percent_scale(d.late_percent)})
	.interpolate("linear")

	var g = d3.select('#chart')
	.append('g')
	.attr('id', id)
	.attr('class', 'timeseries ' + id)

	g.append('path')
	.attr('d', line(data))

	g.selectAll('circle')
	.data(data)
	.enter()
	.append("circle")
	.attr('cx', function(d) {return time_scale(d.time)})
	.attr('cy', function(d) {return percent_scale(d.late_percent)})
	.attr('r',0)

	var enter_duration = 1000;

	g.selectAll('circle')
	.transition()
	.delay(function(d, i) { return i / data.length * enter_duration; })
	.attr('r', 5)
	.each('end',function(d,i){
	if (i === data.length-1){
	add_label(this,d)
	}
	})


	g.selectAll('circle')
	.on('mouseover', function(d){
	d3.select(this)
	.transition().attr('r', 9)
	})
	.on('mouseout', function(d,i){
	if (i !== data.length-1) {
	d3.select(this).transition().attr('r', 5)
	}
	})

	g.selectAll('circle')
	.on('mouseover.tooltip', function(d){
	d3.select("text." + d.line_id).remove()
	d3.select('#chart')
	.append('text')
	.text(d.late_percent + "%")
	.attr('x', time_scale(d.time) + 10)
	.attr('y', percent_scale(d.late_percent) - 10)
	.attr('class', d.line_id)
	})
	.on('mouseout.tooltip', function(d){
	d3.select("text." + d.line_id)
	.transition()
	.duration(500)
	.style('opacity',0)
	.attr('transform','translate(10, -10)')
	.remove()
	})
	}



	function draw(data) {
	"use strict";

	// set up the viewport, the scales, and axis generators

	var container_dimensions = {width: 700, height: 400},
	margins = {top: 10, right: 20, bottom: 30, left: 60},
	chart_dimensions = {
	width: container_dimensions.width - margins.left - margins.right,
	height: container_dimensions.height - margins.top - margins.bottom
	};

	time_scale = d3.time.scale()
	.range([0, chart_dimensions.width])
	.domain([1230789600000, 1301634000000]);

	percent_scale = d3.scale.linear()
	.range([chart_dimensions.height, 0])
	.domain([65, 90]);

	var time_axis = d3.svg.axis()
	.scale(time_scale)

	var count_axis = d3.svg.axis()
	.scale(percent_scale)
	.orient("left");

	// draw axes

	var g = d3.select('#timeseries')
	.append('svg')
	.attr("width", container_dimensions.width)
	.attr("height", container_dimensions.height)
	.append("g")
	.attr("transform", "translate(" + margins.left + "," + margins.top + ")")
	.attr("id","chart");

	g.append("g")
	.attr("class", "x axis")
	.attr("transform", "translate(0," + chart_dimensions.height + ")")
	.call(time_axis);

	g.append("g")
	.attr("class", "y axis")
	.call(count_axis);

	// draw the y-axis label

	d3.select('.y.axis')
	.append('text')
	.text('percent on time')
	.attr('transform', "rotate (-270, 0, 0)")
	.attr('x', 100)
	.attr('y', 50);

	// draw the key

	var key_items = d3.select('#key')
	.selectAll('div')
	.data(data)
	.enter()
	.append('div')
	.attr('class','key_line')
	.attr('id',function(d){return d.line_id+"_key"})

	key_items.append('div')
	.attr('id', function(d){return 'key_square_' + d.line_id})
	.attr('class', function(d){return 'key_square ' + d.line_id})

	key_items.append('div')
	.attr('class','key_label')
	.text(function(d){return d.line_name})

	d3.selectAll('.key_line')
	.on('click', get_timeseries_data)

	}
	</script>
	</head>

	<body>
	<div id = "timeseries"></div>
	<div id = "key"></div>
	<script>
	d3.json("subway_wait_mean.json", draw);
	</script>
	</body>
	body{
	font-family:sans-serif;
	}
	.axis path, line{
	stroke:black;
	}
	.timeseries path{
	stroke-width:3px;
	}
	.timeseries circle{
	stroke: white;
	}
	.timeseries text{
	fill: white;
	stroke: none;
	font-size:12px;
	font-weight: bold;
	}
	.line {
	float:left;
	}
	.line_container{
	width: 150px;
	height: 20px;
	}
	path{
	fill: none;
	}
	.key{
	float:right;
	}
	.key_line{
	font-size:17px;
	width:100%;
	}
	.key_square{
	height:10px;
	width:10px;
	outline:solid 1px black;
	float:left;
	margin-right:10px;
	margin-top:6px;
	margin-left:10px;
	}
	#timeseries{
	float:left;
	}
	.Line_A, .Line_C, .Line_E{
	stroke:#2850AD;
	fill:#2850AD;
	background-color:#2850AD;
	}
	.Line_B, .Line_D, .Line_F, .Line_M {
	stroke:#FF6319;
	fill:#FF6319;
	background-color:#FF6319;
	}
	.Line_G {
	stroke:#6CBE45;
	fill:#6CBE45;
	background-color:#6CBE45;
	}
	.Line_Z_J {
	stroke:#996633;
	fill:#996633;
	background-color:#996633;
	}
	.Line_L {
	stroke:#A7A9AC;
	fill:#A7A9AC;
	background-color:#A7A9AC;
	}
	.Line_N, .Line_Q, .Line_R {
	stroke:#FCCC0A;
	fill:#FCCC0A;
	background-color:#FCCC0A;
	}
	.Line_S {
	stroke:#808183;
	fill:#808183;
	background-color:#808183;
	}
	.Line_1, .Line_2, .Line_3{
	stroke:#EE352E;
	fill:#EE352E;
	background-color:#EE352E;
	}
	.Line_4, .Line_5, .Line_6{
	stroke:#00933C;
	fill:#00933C;
	background-color:#00933C;
	}
	.Line_7 {
	stroke:#B933AD;
	fill:#B933AD;
	background-color:#B933AD;
	}
	[
	{
	"line_id": "Line_1",
	"line_name": "1 Line",
	"mean": 75.60384615384615
	},
	{
	"line_id": "Line_2",
	"line_name": "2 Line",
	"mean": 72.97692307692309
	},
	{
	"line_id": "Line_3",
	"line_name": "3 Line",
	"mean": 76.70384615384613
	},
	{
	"line_id": "Line_4",
	"line_name": "4 Line",
	"mean": 71.39615384615385
	},
	{
	"line_id": "Line_5",
	"line_name": "5 Line",
	"mean": 71.26538461538463
	},
	{
	"line_id": "Line_6",
	"line_name": "6 Line",
	"mean": 73.4
	},
	{
	"line_id": "Line_7",
	"line_name": "7 Line",
	"mean": 75.03846153846155
	},
	{
	"line_id": "Line_A",
	"line_name": "A Line",
	"mean": 71.34615384615385
	},
	{
	"line_id": "Line_B",
	"line_name": "B Line",
	"mean": 77.62307692307692
	},
	{
	"line_id": "Line_C",
	"line_name": "C Line",
	"mean": 79.61153846153846
	},
	{
	"line_id": "Line_D",
	"line_name": "D Line",
	"mean": 79.75
	},
	{
	"line_id": "Line_E",
	"line_name": "E Line",
	"mean": 73.93076923076923
	},
	{
	"line_id": "Line_F",
	"line_name": "F Line",
	"mean": 70.67692307692307
	},
	{
	"line_id": "Line_G",
	"line_name": "G Line",
	"mean": 81.34615384615384
	},
	{
	"line_id": "Line_Z_J",
	"line_name": "J Z Line",
	"mean": 85.05384615384615
	},
	{
	"line_id": "Line_L",
	"line_name": "L Line",
	"mean": 76.97692307692306
	},
	{
	"line_id": "Line_M",
	"line_name": "M Line",
	"mean": 85.94999999999999
	},
	{
	"line_id": "Line_N",
	"line_name": "N Line",
	"mean": 80.26153846153846
	},
	{
	"line_id": "Line_Q",
	"line_name": "Q Line",
	"mean": 81.54615384615383
	},
	{
	"line_id": "Line_R",
	"line_name": "R Line",
	"mean": 77.5153846153846
	}
	]