This repository has been archived by the owner on Jan 15, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
191 lines (162 loc) · 8.91 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
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
<!doctype html>
<html lang="nl">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta property="og:description" name="description" content="Groep-check.nl kan je gebruiken om de kans op een Corona-besmetting in een grote groep mensen te bepalen." />
<meta property="og:title" content="Groep check" />
<meta property="og:locale" content="nl_NL" />
<meta name="author" content="Gerrit-Jan de Bruin" />
<title>Groep check</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
<script src="https://code.jquery.com/jquery-3.5.1.js" integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc=" 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>
<style>
html, body {height: 100%;}
nav .btn {width: 3rem;}
main {width: 100%; max-width: 400px; padding: 15px; margin: auto;}
main, input, footer {text-align: center;}
#rivmData, #ownData {height: 62px;}
input[type="number"] {width: 5rem !important;}
footer {line-height: 1;}
#social a {padding: 5px; font-size: 30px; width: 40px; text-align: center; text-decoration: none; margin: 5px 2px; border-radius: 50%; display: inline-block; color: white;}
#social a:hover {opacity: .7;}
</style>
<script>
const percentage = (x) => Math.round(x*10000)/100;
const calculation = (prob, people) => Math.round(1000*(1-Math.pow(1-prob, +people.value)))/10;
function getRIVM(){
$.getJSON('https://data.rivm.nl/covid-19/COVID-19_prevalentie.json', function(data) {
let lastData = data[data.length-1];
console.log("Cijfers zijn van:", lastData.Date);
console.log("Besmettelijke mensen in Nederland:", lastData.prev_avg, "(", lastData.prev_low, "-", lastData.prev_up, ")");
probability = (lastData.prev_avg / 17000000);
probability_low = (lastData.prev_low / 17000000);
probability_up = (lastData.prev_up / 17000000);
if (isNaN(probability)) {probability = (probability_up + probability_low) / 2; }
console.log("Kans besmetting in Nederland:", probability, "(", probability_low, "-", probability_up, ")");
$('#rivmNow').val(probability);
$('#rivmLow').val(percentage(probability_low));
$('#rivmUp').val(percentage(probability_up));
$('#rivmDate').text('Deze cijfers zijn van ' + lastData.Date + '.');
calculate();
});
}
function calculate(){
if ($('#rivmInput').is(':checked')) {
$('#resultLow').val(calculation(probability_low, numberPeople));
$('#resultUp').val(calculation(probability_up, numberPeople));
} else {
$('#resultAvg').val(calculation($('#ownAvg').val() / 100, numberPeople));
}
}
function changeInput(){
if ($('#rivmInput').is(':checked')){
$("#rivmData").show();
$("#ownData").hide();
$("#ownOutput").hide();
$("#rivmOutput").show();
calculate();
} else {
$("#rivmData").hide();
$("#ownData").show();
$("#ownOutput").show();
$("#rivmOutput").hide();
calculate();
}
}
$(document).ready(function(){
$("#ownOutput").hide();
$("#ownData").hide();
var input = "RIVM";
var probability = 0;
var probability_low = 0;
var probability_up = 0;
getRIVM();
$('#numberPeople').change(calculate);
$('#ownAvg').change(calculate);
$('input[type=radio]').change(changeInput);
});
</script>
<!-- Matomo -->
<script type="text/javascript">
var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//analytics.nieuw-engeland.nl/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '4']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<noscript><p><img src="//analytics.groep-check.nl/matomo.php?idsite=4&rec=1&url=https%3A%2F%2Fwww.groep-check.nl" style="border:0;" alt="" /></p></noscript>
<!-- End Matomo Code -->
</head>
<body>
<nav class="navbar bg-dark justify-content-end">
<a class="navbar-brand btn btn-primary" role="button" href="/" >nl</a>
<a class="navbar-brand btn btn-secondary" role="button" href="/en.html">en</a>
</nav>
<main>
<form>
<h1 class="mb-3 font-weight-normal">Check corona in groep</h1>
<h2 class="h4 text-secondary mb-3 font-weight-normal">Bereken de kans op een coronabesmetting</h2>
<!-- numberPeople input -->
<div class="form-group">
<label for="numberPeople">Aantal mensen in groep</label>
<div class="d-flex justify-content-center"><input type="number" id="numberPeople" class="form-control form-control-sm" autofocus value="1" /></div>
</div>
<!-- dataSource input -->
<div class="form-group">
<label for="inputInfectiousProbability" >Kans dat één persoon geinfecteerd is</label>
<div class="btn-group btn-group-toggle btn-group-sm" data-toggle="buttons">
<label class="btn btn-secondary active btn-default">
<input type="radio" name="dataSource" id="rivmInput" class="btn-block" checked>RIVM data <a href="https://data.rivm.nl/covid-19/" class="text-white" target="_blank">(bron)</a></input>
</label>
<label class="btn btn-secondary">
<input type="radio" name="dataSource" id="ownInput">Eigen data</input>
</label>
</div>
<!-- dataSource: RIVM output -->
<div id="rivmData">
<p class="h2 m-0"><output id="rivmLow"></output>% - <output id="rivmUp"></output>%</p>
<p id="rivmDate" class="text-muted m-0"></p>
</div>
<!-- dataSource: ownData input -->
<div id="ownData" style="display: flex; width: 7rem;" class="align-items-centerd-inline-flex align-items-center m-auto input-group input-group-sm">
<input id="ownAvg" type="number" class="form-control" value="1"/>
<div class="input-group-append"><span class="input-group-text">%</span></div>
</div>
</div>
<!-- result -->
<div class="form-group">
<label>Kans dat ten minste één iemand in de groep geinfecteerd is</label>
<p class="h1" id="ownOutput"><output id="resultAvg"></output>%</p>
<p class="h1" id="rivmOutput"><output id="resultLow"></output>% - <output id="resultUp"></output>%</p>
</div>
</form>
<!-- Bottom -->
<hr />
<h4>Deel deze pagina</h4>
<div id="social" class="d-flex justify-content-center">
<a href="https://www.facebook.com/sharer/sharer.php?u=https://www.groep-check.nl/" class="fa fa-facebook" style="background: #3B5998;"></a>
<a href="https://twitter.com/intent/tweet?text=Check+het+risico+op+corona+in+je+groep+op+www.groep-check.nl%2F%21" class="fa fa-twitter" style="background: #55ACEE;"></a>
<a href="https://www.linkedin.com/shareArticle?mini=true&url=https://groep-check.nl&title=Groep%20check" class="fa fa-linkedin" style="background: #007bb5;"></a>
<a href="https://www.reddit.com/submit?url=https://groep-check.nl&title=Groep+check" class="fa fa-reddit" style="background: #ff5700;"></a>
<a href="https://github.com/gerritjandebruin/groep-check" class="fa fa-github" style="background: #ff922b;"></a>
</div>
<hr />
<h4>Disclaimer</h4>
<p>Deze berekening gaat er van uit dat de kans dat iemand geinfecteerd is in de groep onafhankelijk voor iedereen in de groep is.</p>
<p>Er wordt gebruik gemaakt van de <a href="https://nl.wikipedia.org/wiki/Binomiale_verdeling" target="_blank">binominale verdeling</a> om de kans op besmetting te berekenen.</p>
</main>
<footer class='text-muted'><small>
Deze website is gemaakt door <a href="https://gerritjandebruin.nl" target="_blank">Gerrit-Jan de Bruin</a> en wordt gehost door middel van <a href="https://github.com/gerritjandebruin/groep-check" target="_blank">Github Pages</a>.<br />
Opmerkingen zijn <a href="https://github.com/gerritjandebruin/groep-check/issues/new" target="_blank">hier</a> welkom.
</small></footer>
</body>
</html>