-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
95 lines (73 loc) · 4.85 KB
/
index.html
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
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="UTF-8">
<title>LandingPage</title>
<!-- Bootstrap CDN -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="styles.css">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light navbar-custom">
<a class="navbar-brand navbar-custom" href="index.html">Latitude</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle navbar-custom" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Plots</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="VisualizationPage_MaxTemp.html">Max Temperature</a>
<a class="dropdown-item" href="VisualizationPage_Humidity.html">Humidity</a>
<a class="dropdown-item" href="VisualizationPage_Cloudiness.html">Cloudiness</a>
<a class="dropdown-item" href="VisualizationPage_WindSpeed.html">Wind Speed</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link navbar-custom" href="ComparisonPage.html">Comparison</a>
</li>
<li class="nav-item">
<a class="nav-link navbar-custom" href="DataPage.html">Data</a>
</li>
</ul>
</div>
</nav>
<br>
<div class="row">
<div class="col-md-1"></div>
<div class="col-md-7 content">
<h1>Summary: Latitude vs. [Climate Factors]</h1>
<hr>
<article>
<img src="Resources/assets/images/Fig1.png" alt="Tempurature Map" class="big_img" width=50% style="float: left">
<br>
<p>In this project, we created a Python script to visualize and analyze various climate factors of over 500 cities across the world of varying distance from the equator. To accomplish this analysis, we utilized several Python libraries, the OpenWeatherMap API, and some statistical analysis techniques to create a representative model of weather across world cities.</p>
<p>To elaborate on the whole processes, we pulled weather data from the OpenWeatherMap API to assemble a dataset with Pandas on over 500 cities. Then, we used Matplotlib to plot various climate factors vs. latitude, which include max temperature, humidity, cloudiness, and wind speed. Next off, we performed linear regression on each climate factor vs. latitude for our analysis. The result is shown in depth on each visualization page.</p>
</article>
</div>
<div class="col-md-3 content">
<h1>Visualizations</h1>
<article>
<hr>
<a href="VisualizationPage_MaxTemp.html">
<img src="Resources/assets/images/Fig1.png" alt="Tempurature Map" class="small_img">
</a>
<a href="VisualizationPage_Humidity.html">
<img src="Resources/assets/images/Fig2.png" alt="Humidity Map" class="small_img">
</a>
<a href="VisualizationPage_Cloudiness.html">
<img src="Resources/assets/images/Fig3.png" alt="Cloudiness Map" class="small_img">
</a>
<a href="VisualizationPage_WindSpeed.html">
<img src="Resources/assets/images/Fig4.png" alt="WindSpeed Map" class="small_img">
</a>
</article>
</div>
<div class="col-md-1"></div>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>