admin.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../../favicon.ico">

    <title>Rate My Ride</title>

    <!-- Bootstrap core CSS -->
    <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
    <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
    <link href='http://fonts.googleapis.com/css?family=Lato:100,200,400,700' rel='stylesheet' type='text/css'>

    <!-- Custom styles for this template -->
    <link href="css/admin.css" rel="stylesheet">

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script src="http://maps.google.com/maps/api/js"></script>
    <script src="http://js.pusher.com/2.2/pusher.min.js"></script>
    <script src="js/chart.js"></script>
    <script src="js/admin.js"></script>

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>

  <body>
    
    <div class="container">
    <h2><img src="img/LogoTransportHack.png" style="height:30px;width:30px;"> Live Dashboard</h2>
    <hr>
      <div class="row">

        <div class="col-md-12">

          <div class="panel panel-default">
            <div class="panel-heading">
              <h3 class="panel-title">Map</h3>
            </div>
            <div class="panel-body" style="padding:0px;">
                <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}i4ewOd-pzNkMb-haAclf, qAWA2 {display:none;}</style><div class='embed-container graph'><iframe src='https://www.google.com/maps/d/embed?mid=zU1a3GttEmBs.kzrjlflfnsT4' width='640' height='480'></iframe></div>
            </div>
          </div>
        </div>
        <div class="col-md-6">

          <div class="panel panel-default">
            <div class="panel-heading">
              <h3 class="panel-title">Was your bus on time?</h3>
            </div>
            <div class="panel-body">
                <canvas id="time-graph"></canvas>
            </div>
          </div>
        </div>

        <div class="col-md-6">

          <div class="panel panel-default">
            <div class="panel-heading">
              <h3 class="panel-title">Was your bus clean?</h3>
            </div>
            <div class="panel-body">
                <canvas id="clean-graph"></canvas>
            </div>
          </div>
        </div>

        <div class="col-md-6">

          <div class="panel panel-default">
            <div class="panel-heading">
              <h3 class="panel-title">What areas would you improve?</h3>
            </div>
            <div class="panel-body">
                <canvas id="improvement-graph"></canvas>
            </div>
          </div>
        </div>

      </div>
    </div>

  </body>