UTA_transit_routes_GroupProject/index.html at main · xiaoyatang/UTA_transit_routes_GroupProject · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
  <meta charset="utf-8" />
  <title>UTA Transit Routes</title>

  <link rel="stylesheet" href="https://js.arcgis.com/4.25/esri/themes/light/main.css" />
  <link rel="icon" href="data:,">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" crossorigin="anonymous">
  <link rel="stylesheet" href="/js/styles.css"/>

  <script src="https://d3js.org/d3.v7.min.js"></script>
  <script src="https://js.arcgis.com/4.25/"></script>
</head>

<body>
  <div id="wrapper">
    <div class="top-nav">
      <div class="container">
        <div class="row">
          <div class="col-sm-12">
            <div class="pull-left">
              Authors: Milena Belianovich, Tark Patel, Xiaoya Tang
            </div>
            <div class="pull-right">
              <a target="_new" href="https://github.com/xiaoyatang/UTA_transit_routes_GroupProject.git"><i class="fa fa-github fa-lg"></i></a>
              <a target="_new" href="https://www.cs.utah.edu/"><i class="fa fa-question fa-lg"></i></a>
              <a target="_new" href="https://www.youtube.com/watch?v=F_1NB7qjTOM"><i class="fa fa-youtube-play fa-lg"></i></a>
            </div>
           </form>
          </div>
        </div>
      </div>
    </div>
  </div>

    <h1>UTA Transit Routes</h1>

    <div class='row' id='content'>
      <div class="column left">
        <div id="map"></div>
        <div id="select-by-rectangle"
          class="esri-widget esri-widget--button esri-widget esri-interactive"
          title="Select features by rectangle">
          <span class="esri-icon-checkbox-unchecked"></span>
        </div>
        <div id="clear-selection"
        class="esri-widget esri-widget--button esri-widget esri-interactive"
        title="Clear selection">
        <span class="esri-icon-erase"></span>
      </div>
      </div>
      <div class="column-right">
        <div class="toolbox">
          <span>
            <label>Year</label>
            <select id="Year">
              <option value="2020">2020</option>
              <option value="2021">2021</option>
              <option selected value="2022">2022</option>
            </select>
          </span>
        </div>
        <div class="'toolbox">
          <span>
            <label>Bus Type</label>
            <select id="BusType">
              <option value="Fixed Route Bus - Express">Fixed Route Bus - Express</option>
              <option value="Fixed Route Bus - Regular">Fixed Route Bus - Regular</option>
              <option selected value="Fixed Route Bus - Ski">Fixed Route Bus - Ski</option>
              <option value="Route Deviation">Route Deviation</option>
              <option value="Fixed Route Bus - UTA Rapid">Fixed Route Bus - UTA Rapid</option>
              <option value="Commuter Rail">Commuter Rail</option>
              <option value="Light Rail">Light Rail</option>
              <option value="Streetcar">Streetcar</option>
            </select>
          </span>
        </div>
        <svg id="chart2">
          <g id="x-axis"></g>
          <g id="y-axis"></g>
          <g id="bars"></g>
          <g id="overlay"><line></line></g>
        </svg>
        <div class="'toolbox">
          <span>
            <label>Day Types</label>
            <select id="metric2">
              <option value="all">All Days</option>
              <option value="weekday">Week Days</option>
              <option value="weekend">Weekends</option>
            </select>
          </span>
        </div>
        <svg id="chart3">
          <g id="x-axis"></g>
          <g id="y-axis"></g>
          <g id="circles"></g>
          <g id="colorScale"></g>
        </svg>
      </div>
    </div>

  <footer>
    <div class="footer">
       <div class="container">
         <div class="row">
          <div class="col-sm-12 col-md-6">
            <p><strong>Good day :)</strong></p>
            <p>Thank you for using out website. We appreciate your interest!</p>
            <p>In order to learn more about the use of this website, we offer this <a href="https://www.youtube.com/watch?v=e1XI79XWGo8">educational YouTube video</a>.</p>
            <p>You can also visit the <a href="https://github.com/xiaoyatang/UTA_transit_routes_GroupProject.git">repository with our initial code and data</a>, if you like.</p>
          </div>
          <div class="col-sm-12 col-md-6">
            <p><strong>Sources</strong></p>
        <ul class="social-media-list">

          <li>
            <i class="fa fa-github fa-lg" aria-hidden="true"></i>
            <a href="https://github.com/xiaoyatang/UTA_transit_routes_GroupProject.git">GitHub Repository</a>
          </li>

          <li>
            <i class="fa fa-youtube-play fa-lg" aria-hidden="true"></i>
            <a href="https://www.youtube.com/watch?v=e1XI79XWGo8">YouTube Video</a>
          </li>

          <li>
            <i class="fa fa-question fa-lg" aria-hidden="true"></i>
            <a href="https://www.cs.utah.edu/">CIS Department of Univesity the of Utah</a>
          </li>

          <li>
            <i class="fa fa-bus fa-lg" aria-hidden="true"></i>
            <a href="https://data-rideuta.opendata.arcgis.com/">UTA opendata website</a>
          </li>

        </ul>
          </div>
        </div>
       </div>
    </div>
    <div class="infinite-copyright-wrapper">
      <div class="infinite-copyright-container infinite-container">
        <div class="infinite-copyright-text infinite-item-pdlr">
          <div class="copyright">
          <strong>Copyright © 2022 Milena Belianovich, Tark Patel, Xiaoya Tang. All Rights Reserved.</strong>
        </div></div>
      </div>
    </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
  </footer>

  <script src="js/box.js"></script>
    <script src="js/bar.js"></script>
    <script src="js/scatter.js"></script>
    <script src="js/map.js"></script>
    <script src="js/script.js"></script>

</body>
</html>