-
Notifications
You must be signed in to change notification settings - Fork 2
/
covidworldmaps.html
118 lines (97 loc) · 5.68 KB
/
covidworldmaps.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
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
<!DOCTYPE html>
<html lang="en">
<title>Covid-19 Dashboard Tracker</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/w3.css">
<link rel="stylesheet" href="css/w3-colors-metro.css">
<link
href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;1,300;1,400;1,600&display=swap"
rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
integrity="sha512-1ycn6IcaQQ40/MKBW2W4Rhis/DbILU74C1vSrLJxCq57o941Ym01SwNsOMqvEBFlcgUa6xLiPY/NS5R+E6ztJQ=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<link href="css/anychart-ui.min.css" type="text/css" rel="stylesheet">
<link href="css/anychart-font.min.css" type="text/css" rel="stylesheet">
<link href="css/customcss.css" rel="stylesheet">
<body class="bg-dashboard">
<div class="w3-bar w3-top w3-large topbar-custom" style="z-index:4">
<button class="w3-bar-item w3-button w3-hide-large w3-hover-none w3-hover-text-light-grey"
onclick="w3_open();"><i class="fa fa-bars"></i> Menu</button>
<a href="index.html"><span class="w3-bar-item w3-right w3-xlarge dashboardTitle"><i class="fas fa-spinner"></i>
CovidData</span></a>
</div>
<!-- Sidebar/menu -->
<nav class="w3-sidebar w3-collapse sidebar-custom w3-animate-left w3-round-large w3-card-4 w3-margin"
id="dashSidebar">
<div class="w3-container w3-margin-top">
<h5 class="sidebaritle">Covid Data Dashboard</h5>
</div>
<hr>
<div class="w3-bar-block">
<a href="#" class="w3-bar-item w3-button w3-padding-16 w3-hide-large bg-closemenu" onclick="w3_close()"
title="close menu"><i class="far fa-times-circle w3-large w3-margin-right"></i> Close Menu</a>
<a href="index.html" class="w3-margin-bottom w3-bar-item w3-button w3-padding w3-hover-amber"><i
class="fas fa-pills w3-large w3-margin-right"></i>
World Overview</a>
<a href="covidvaccinations.html" class="w3-margin-bottom w3-bar-item w3-button w3-padding w3-hover-green"><i
class="fas fa-syringe w3-large w3-margin-right"></i> World Vaccinations</a>
<a href="covidworldmaps.html" class="w3-margin-bottom w3-bar-item w3-button w3-padding w3-hover-teal"><i
class="fas fa-globe-europe w3-large w3-margin-right"></i> World Map</a>
<a href="covidchartsdata.html"
class="w3-margin-bottom w3-bar-item w3-button w3-padding w3-hover-light-green"><i
class="fas fa-chart-bar w3-large w3-margin-right"></i> World Charts</a>
<a href="covidfrance.html" class="w3-margin-bottom w3-bar-item w3-button w3-padding w3-hover-blue"><i
class="fas fa-flag w3-large w3-margin-right"></i> Covid France</a>
<a href="covidnews.html" class="w3-margin-bottom w3-bar-item w3-button w3-padding w3-hover-cyan"><i
class="fas fa-newspaper w3-large w3-margin-right"></i> News about Covid</a>
<a href="about.html" class="w3-margin-bottom w3-bar-item w3-button w3-padding w3-hover-red"><i
class="fas fa-info-circle w3-large w3-margin-right"></i> About</a>
</div>
</nav>
<!-- Overlay effect when opening sidebar on small screens -->
<div class="w3-overlay w3-hide-large w3-animate-opacity" onclick="w3_close()" style="cursor:pointer"
title="close side menu" id="myOverlay"></div>
<!-- !PAGE CONTENT! -->
<div class="w3-main main-custom">
<header class="w3-container">
<h5 class="w3-large"><i class="fas fa-globe w3-text-teal"></i> Covid-19 World map of actual active &
critical cases. Last update: <span id="latestUpdateActive" class="w3-text-teal"></span>
</h5>
<p class="w3-small">Double click on the map to zoom or use control buttons. Right click on the map for
context menu.</p>
</header>
<div class="w3-row w3-margin-bottom">
<div id="worldActiveCritical" class="w3-container worldMap">
<div class="w3-padding-16 dark-element w3-round-large w3-card-4">
<div id="containerMap"></div>
</div>
</div>
</div>
<!-- Footer -->
<footer class="w3-container w3-padding-16 footer-custom">
<p class="w3-right"><span class="copyrightDate"></span> Made by Maxime des Touches. <a
href="https://github.com/elreviae" target="_blank" class="footerlink">Github</a></p>
</footer>
<!-- End page content -->
</div>
<script src="js/jquery-3.6.0.min.js"></script>
<script src="js/anychart/anychart-base.min.js"></script>
<script src="js/anychart/anychart-ui.min.js"></script>
<script src="js/anychart/anychart-exports.min.js"></script>
<script src="js/anychart/anychart-map.min.js"></script>
<script src="js/anychart/anychart-data-adapter.min.js"></script>
<script src="js/anychart/world.js"></script>
<script src="js/anychart/proj4.js"></script>
<script src="js/moment-with-locales.min.js"></script>
<script src="js/min/customanymapActiveCritical.min.js"></script>
<script src="js/customsite.js"></script>
<script>
let worldMapActive = 'https://disease.sh/v3/covid-19/countries?yesterday=true&allowNull=true';
$.getJSON(worldMapActive, function (response) {
let latestUpdateActiveWorldMap = moment(response[0].updated).format('LLL');
$('#latestUpdateActive').html(latestUpdateActiveWorldMap);
});
</script>
</body>
</html>