-
Notifications
You must be signed in to change notification settings - Fork 0
/
internetpenetration.html
116 lines (97 loc) · 4.28 KB
/
internetpenetration.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
<!DOCTYPE html>
<html>
<head>
<link href="styles/styles.css" rel="stylesheet" type="text/css">
<link rel="icon" href="Eyecon.png">
<title>Internet Penetration</title>
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet">
<link rel="stylesheet" href="styles/cyberindex.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
table {
border-collapse: collapse;
width: 100%;
border-style: none;
}
th, td {
padding: 0.25rem;
text-align: left;
border: 0px solid #ccc;
text-align: left;
vertical-align: top;
padding: 30px;
border-bottom: 1px solid #ddd;
border-left: 1px solid #ddd;
}
.no-border {
border-left: none;
}
</style>
</head>
<body>
<h1>Internet penetration</h1>
<!--this section creates the html for the top horizontal navigation bar-->
<div class="topnav" id="myTopnav">
<a href="index.html" >Home</a>
<a href="types.html">Types of Cyber Attacks</a>
<a href="breaches.html">Data breaches</a>
<a href="internetpenetration.html" class="on">Internet penetration</a>
<a href="cyberindex.html" >Cybersecurity Index</a>
<a href="javascript:void(0);" class="icon" onclick="myFunction()">☰</a>
</div>
<h2>From Budapest to Aruba: required patches and updates to a 2001 convention</h2>
<!--
Order:
<select id="order">
<option value="null" selected> ----- </option>
<option value="sortinit_col_row">Initial order on columns and rows</option>
<option value="sortinit_row">Initial order on rows</option>
<option value="sortinit_col">Initial order on columns</option>
</select>
-->
<br>
<table>
<tr>
<th class="no-border">
<h3>Internet penetration </h3> <p><I><font color="grey">Individuals equiped with access to the Internet, % </I></font></p>
</th>
<th><h3>>>> What does this have to do with Aruba, Budapest, or 2001?</h3></th>
</tr>
<tr>
<td class="no-border">
<p><front color="grey">### Fixes to heatmap size and legend coming up soon, stay tuned!</front></p>
<i>Palette</i><br>
<select id="Palette">
<option value="RdYlGn">RdYlGn</option>
<option value="Spectral">Spectral</option>
<option value="RdYlBu">RdYlBu</option>
<option value="RdGy">RdGy</option>
<option value="RdBu">RdBu</option>
<option value="PiYG">PiYG</option>
<option value="PRGn">PRGn</option>
<option value="BrBG">BrBG</option>
<option value="PuOr" selected>PuOr</option>
</select>
<div id="heatmap"></div>
</td>
<div>
<div>
<td>The evolution of internet penetration from 1990 to today helps to visualize the growing opportunities and risks of the Internet and the many nuances across the globe. If the Internet serves as a support for individual, business or public-sector communications and transactions, it also presents a new vector for attacks: cyberattacks.<br><br>The visualization we created helps to see cybersecurity not only as the preoccupation of developed countries but rather as a global concern. That countries from Aruba to Pakistan are so well connected has strong implications for the world order. The circonvoluted paths ransomwares such as WannaCrypt took across the globe is further proof global connectivity poses security issues beyond the borders of the sole "high-tech" countries.<br><br>This reminds us of the much-needed international cooperation on the issue. The weaknesses of Aruba's cybersecurite are an immediate threat to any other country in the world. The 56 signatories of the Budapest Convention sent a strong signal in 2001. Perhaps it is time to rething the convention, in its implementation, scope, and breadth of parties?</td>
</div>
</div>
</tr>
</table>
<p>Data sourced from <a href="https://data.worldbank.org/indicator/IT.NET.USER.ZS">the World Bank</a>. Visualization sourced from <a href="http://bl.ocks.org/PBrockmann/635179ff33f17d2d75c2">here</a>.</p>
<script src="topnav.js"></script>
<script src="https://d3js.org/d3.v3.js"></script>
<script src="https://d3js.org/colorbrewer.v1.min.js"></script>
<script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="scripts/heatmap.js"></script>
<link rel="stylesheet" href="styles/heatmap.css" />
<script>
$(document).ready(function() {
heatmap_display("raw_data/metrics_ocmip5_2.json", "#heatmap", "PuOr");
});
</script>
</body>
</html>