-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
51 lines (44 loc) · 1.63 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
<!DOCTYPE html>
<html>
<body>
<p>Click the button to get your pollution data.</p>
<button onclick="getLocation()">Click me</button>
<p id="demo"></p>
<script>
var x = document.getElementById("demo");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
const url = `https://api.openweathermap.org/data/2.5/air_pollution?lat=${position.coords.latitude}&lon=${position.coords.longitude}&appid=cbb82274b717172f81f9cd714dd51027`
fetch(url)
.then(res => res.json())
.then(json => json.list)
.then(list => list[0].components)
.then(components => {
coLevel = components.co
noLevel = components.no
no2Level = components.no2
o3Level = components.o3
so2Level = components.so2
pm2_5Level = components.pm2_5
pm10Level = components.pm10
nh3Level = components.nh3
console.log(components)
document.write(`Carbon Monoxide - ${coLevel}0
<br> Nitrogen Monoxide - ${noLevel}
<br> Nitrogen Dioxide - ${no2Level}
<br> Ozone - ${o3Level}
<br> Sulphur dioxide - ${so2Level}
<br> PM 2.5 - ${pm2_5Level}
<br> Pm 10 - ${pm10Level}
<br> Ammonia - ${nh3Level}`)
})
}
</script>
</body>
</html>