-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcloudiess.html
78 lines (74 loc) · 4.91 KB
/
cloudiess.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
<!DOCTYPE html>
<html lang="en">
<head>
<link href="https://fonts.googleapis.com/css?family=Cardo:400,700|Oswald" rel="stylesheet">
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatiable" content="IE=edge">
<title>Latitude vs Cloudiness </title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta nmae="description" content="A dashboard displaying a summary of my HTML and CSS skills to create a data visualisation dashboard">
<meta name="author" content="Presit Kaur">
<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" type="text/css" href="style.css">
</head>
<body>
<div class="navigation">
<nav class="navbar navbar-expand-lg navbar-light">
<a class="navbar-brand" href="index.html">Latitude</a>
<button class="navbar-toggler border border-white" typr="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavDropdown">
<ul class="collapse-nav ml-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropDownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Plots
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<a class="dropdown-item" href="humidity.html">Humidity</a>
<a class="dropdown-item" href="cloudiness.html">Cloudiness</a>
<a class="dropdown-item" href="wind-speed.html">Wind Speed</a>
<a class="dropdown-item" href="max-temp.html">Maximum Temperature</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="comparisons.html">Comparison</a>
</li>
<li class="nav-item">
<a class="nav-link" href="data.html">Data</a>
</li>
</ul>
</div>
</nav>
</div>
<div class="container">
<div class="row">
<div class="col-lg-5 col-md-12">
<div class="box" style="padding-bottom: 20px;">
<h3 class="title">Analysis</h3>
<p> As observed, the data points on this graph are scattered randomly between 0% and 100%.
This indicates that there is no correlation betweeen a cities latitude and their cloudiness percentage. </p>
<p> Clouds are created when the water vapors in the air are condensed together to create a form that can be seen.
Warmer air can hold more water vapors than colder air before becoming clouds. It is difficult to analyse
the effect of latitude with several cities scatterd across the earth if one half of the globe is in Autumn and the other is in Spring.
</p>
<p> A better way to potentially analyse the effect of latitude on cloudiness would be to focus on looking at only one Hemisphere at a time for a specific season.</p>
</div>
</div>
<div class="col-lg-7 col-md-8">
<div class="box">
<h3 class="title">Latitude vs Cloudiness</h3>
<div class="container">
<div class="row" style="padding-bottom: 20px;">
<img class= "display-img" src="Images/cloudiness.png" alt="Cloudiness Graph">
</div>
</div>
</div>
</div>
</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>