Web_Visualization/visual_windspeed.html at master · nguyenndt278/Web_Visualization · 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

<!DOCTYPE html>
<html lang="en-us">
  <head>

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Weather Pie</title>
    <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="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
    <link rel="stylesheet" href="mystyle.css">
  </head>
  <header>
      <nav class="navbar navbar-expand-lg navbar-light bg-info">
          <a class="navbar-brand" href="https://nguyenndt278.github.io/Web_Visualization/">Landing Page <i class="fas fa-heart"></i></a>
          <button class="navbar-toggler" type="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="navbar-nav">
              <li class="nav-item active">
                <a class="nav-link" href="https://github.com/nguyenndt278" target="_blank">Nguyen's Git Hub <i class='fas fa-dog' style='font-size:20px;color:green'></i><span class="sr-only">(current)</span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="https://nguyenndt278.github.io/Web_Visualization/Data_Py.html">Data <i class='fas fa-chart-line' style='font-size:20px;color:rgb(8, 54, 4)'></i></a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="https://nguyenndt278.github.io/Web_Visualization/compare.html">Comparisions <i class='fas fa-balance-scale' style='font-size:20px;color:rgb(111, 105, 202)'></i></a>
              </li>
              <li class="float">
              <li class="my-2 my-sm-0 nav-item dropdown float">
                <a class="nav-link dropdown-toggle float" href="#" id="navbarDropdownMenuLink" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                  Plots <i class="fa fa-bar-chart" style="font-size:48px;color:violet"></i>
                </a>
                <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
                  <a class="dropdown-item" href="https://nguyenndt278.github.io/Web_Visualization//visual_maxTemp.html">Max Temperatures</a>
                  <a class="dropdown-item" href="https://nguyenndt278.github.io/Web_Visualization/visual_humidity.html">Humidity</a>
                  <a class="dropdown-item" href="https://nguyenndt278.github.io/Web_Visualization/visual_cloudiness.html">Cloudiness</a>
                  <a class="dropdown-item" href="https://nguyenndt278.github.io/Web_Visualization/visual_windspeed.html">Wind Speed</a>
                </div>
              </li>
            </li>
            </ul>
          </div>
        </nav>
  </header>
<body>
    <div class="container-fluid">
        <div class="row">
          <div class="col-sm-6" style="background-color: rgb(245, 235, 244);">
              <h2 class="h2">Wind Speed</h2>
              <img class="img-fluid" src="image\WindvsLat.png" alt "Equator">
              <p class="p">There is not a strong correlation between wind speed and latitude. It seems like the wind speed only gets higher when it approaches the poles. Reason is because the wind speed is influenced by pressure and land position rather than latitude.</p>
          </div>
          <div class="col-sm-6 ali" style="background-color: rgb(207, 219, 200);">
              <h2 class="h22">Visualizations <i class='fas fa-camera' style='font-size:40px;color:rgb(11, 116, 11)'></i></h2>
            <div class="col-sm-6">
              <a href="https://nguyenndt278.github.io/Web_Visualization/visual_cloudiness.html">
                  <img class="h2 mx-auto d-block img-fluid" src="image\CloudvsLat.png" alt "LatvsCloud"></a>
              </div>
            <div class="col-sm-6">
                <a href="https://nguyenndt278.github.io/Web_Visualization/visual_maxTemp.html">
                  <img class="mx-auto d-block img-fluid" src="image\TempvsLat.png" alt "LatvsTemp"></a>
            </div>
            <div class="col-sm-6">
              <a href="https://nguyenndt278.github.io/Web_Visualization/visual_humidity.html">
                <img class="h2 mx-auto d-block img-fluid" src="image\HumidvsLat.png" alt "LatvsHumid"></a>
              </div>
              <div class="col-sm-6">
                <a href="https://nguyenndt278.github.io/Web_Visualization/visual_windspeed.html">
                  <img class="h2 mx-auto d-block img-fluid" id="img" src="image\WindvsLat.png" alt "LatvsWind"></a>
               </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>