-
Notifications
You must be signed in to change notification settings - Fork 4
/
NapoleonMarch.html
35 lines (33 loc) · 7.1 KB
/
NapoleonMarch.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
<!DOCTYPE html>
<html>
<head>
<style>
.error {
color: red;
}
</style>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm//vega@5"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm//vega-lite@4.8.1"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm//vega-embed@6"></script>
</head>
<body>
<div id="vis"></div>
<script>
(function(vegaEmbed) {
var spec = {"config": {"view": {"continuousWidth": 400, "continuousHeight": 300}}, "layer": [{"data": {"name": "data-56af38f370621560624276220716fba8"}, "mark": "trail", "encoding": {"color": {"type": "nominal", "field": "direction", "scale": {"domain": ["A", "R"], "range": ["#E3CBAB", "#606060"]}}, "detail": {"type": "nominal", "field": "group"}, "size": {"type": "quantitative", "field": "survivors", "scale": {"domain": [50000, 300000], "range": [7, 35]}}, "x": {"type": "quantitative", "field": "long", "scale": {"domain": [23, 38], "zero": false}}, "y": {"type": "quantitative", "field": "lat", "scale": {"domain": [53.8, 56], "zero": false}}}, "height": 200, "width": 600}, {"data": {"name": "data-b40ad95d03717c8464b78bdbccd6fbb8"}, "mark": "text", "encoding": {"text": {"type": "nominal", "field": "city"}, "x": {"type": "quantitative", "field": "long", "scale": {"zero": false}}, "y": {"type": "quantitative", "field": "lat", "scale": {"zero": false}}}, "height": 200, "width": 600}], "$schema": "https://vega.github.io/schema/vega-lite/v4.8.1.json", "datasets": {"data-56af38f370621560624276220716fba8": [{"long": 24.0, "lat": 54.9, "survivors": 340000, "direction": "A", "group": 1}, {"long": 24.5, "lat": 55.0, "survivors": 340000, "direction": "A", "group": 1}, {"long": 25.5, "lat": 54.5, "survivors": 340000, "direction": "A", "group": 1}, {"long": 26.0, "lat": 54.7, "survivors": 320000, "direction": "A", "group": 1}, {"long": 27.0, "lat": 54.8, "survivors": 300000, "direction": "A", "group": 1}, {"long": 28.0, "lat": 54.9, "survivors": 280000, "direction": "A", "group": 1}, {"long": 28.5, "lat": 55.0, "survivors": 240000, "direction": "A", "group": 1}, {"long": 29.0, "lat": 55.1, "survivors": 210000, "direction": "A", "group": 1}, {"long": 30.0, "lat": 55.2, "survivors": 180000, "direction": "A", "group": 1}, {"long": 30.3, "lat": 55.3, "survivors": 175000, "direction": "A", "group": 1}, {"long": 32.0, "lat": 54.8, "survivors": 145000, "direction": "A", "group": 1}, {"long": 33.2, "lat": 54.9, "survivors": 140000, "direction": "A", "group": 1}, {"long": 34.4, "lat": 55.5, "survivors": 127100, "direction": "A", "group": 1}, {"long": 35.5, "lat": 55.4, "survivors": 100000, "direction": "A", "group": 1}, {"long": 36.0, "lat": 55.5, "survivors": 100000, "direction": "A", "group": 1}, {"long": 37.6, "lat": 55.8, "survivors": 100000, "direction": "A", "group": 1}, {"long": 37.7, "lat": 55.7, "survivors": 100000, "direction": "R", "group": 1}, {"long": 37.5, "lat": 55.7, "survivors": 98000, "direction": "R", "group": 1}, {"long": 37.0, "lat": 55.0, "survivors": 97000, "direction": "R", "group": 1}, {"long": 36.8, "lat": 55.0, "survivors": 96000, "direction": "R", "group": 1}, {"long": 35.4, "lat": 55.3, "survivors": 87000, "direction": "R", "group": 1}, {"long": 34.3, "lat": 55.2, "survivors": 55000, "direction": "R", "group": 1}, {"long": 33.3, "lat": 54.8, "survivors": 37000, "direction": "R", "group": 1}, {"long": 32.0, "lat": 54.6, "survivors": 24000, "direction": "R", "group": 1}, {"long": 30.4, "lat": 54.4, "survivors": 20000, "direction": "R", "group": 1}, {"long": 29.2, "lat": 54.3, "survivors": 20000, "direction": "R", "group": 1}, {"long": 28.5, "lat": 54.2, "survivors": 20000, "direction": "R", "group": 1}, {"long": 28.3, "lat": 54.3, "survivors": 20000, "direction": "R", "group": 1}, {"long": 27.5, "lat": 54.5, "survivors": 20000, "direction": "R", "group": 1}, {"long": 26.8, "lat": 54.3, "survivors": 12000, "direction": "R", "group": 1}, {"long": 26.4, "lat": 54.4, "survivors": 14000, "direction": "R", "group": 1}, {"long": 25.0, "lat": 54.4, "survivors": 8000, "direction": "R", "group": 1}, {"long": 24.4, "lat": 54.4, "survivors": 4000, "direction": "R", "group": 1}, {"long": 24.2, "lat": 54.4, "survivors": 4000, "direction": "R", "group": 1}, {"long": 24.1, "lat": 54.4, "survivors": 4000, "direction": "R", "group": 1}, {"long": 24.0, "lat": 55.1, "survivors": 60000, "direction": "A", "group": 2}, {"long": 24.5, "lat": 55.2, "survivors": 60000, "direction": "A", "group": 2}, {"long": 25.5, "lat": 54.7, "survivors": 60000, "direction": "A", "group": 2}, {"long": 26.6, "lat": 55.7, "survivors": 40000, "direction": "A", "group": 2}, {"long": 27.4, "lat": 55.6, "survivors": 33000, "direction": "A", "group": 2}, {"long": 28.7, "lat": 55.5, "survivors": 33000, "direction": "A", "group": 2}, {"long": 28.7, "lat": 55.5, "survivors": 33000, "direction": "R", "group": 2}, {"long": 29.2, "lat": 54.2, "survivors": 30000, "direction": "R", "group": 2}, {"long": 28.5, "lat": 54.1, "survivors": 30000, "direction": "R", "group": 2}, {"long": 28.3, "lat": 54.2, "survivors": 28000, "direction": "R", "group": 2}, {"long": 24.0, "lat": 55.2, "survivors": 22000, "direction": "A", "group": 3}, {"long": 24.5, "lat": 55.3, "survivors": 22000, "direction": "A", "group": 3}, {"long": 24.6, "lat": 55.8, "survivors": 6000, "direction": "A", "group": 3}, {"long": 24.6, "lat": 55.8, "survivors": 6000, "direction": "R", "group": 3}, {"long": 24.2, "lat": 54.4, "survivors": 6000, "direction": "R", "group": 3}, {"long": 24.1, "lat": 54.4, "survivors": 6000, "direction": "R", "group": 3}], "data-b40ad95d03717c8464b78bdbccd6fbb8": [{"long": 24.0, "lat": 55.0, "city": "Kowno"}, {"long": 25.3, "lat": 54.7, "city": "Wilna"}, {"long": 26.4, "lat": 54.4, "city": "Smorgoni"}, {"long": 26.8, "lat": 54.3, "city": "Moiodexno"}, {"long": 27.7, "lat": 55.2, "city": "Gloubokoe"}, {"long": 27.6, "lat": 53.9, "city": "Minsk"}, {"long": 28.5, "lat": 54.3, "city": "Studienska"}, {"long": 28.7, "lat": 55.5, "city": "Polotzk"}, {"long": 29.2, "lat": 54.4, "city": "Bobr"}, {"long": 30.2, "lat": 55.3, "city": "Witebsk"}, {"long": 30.4, "lat": 54.5, "city": "Orscha"}, {"long": 30.4, "lat": 53.9, "city": "Mohilow"}, {"long": 32.0, "lat": 54.8, "city": "Smolensk"}, {"long": 33.2, "lat": 54.9, "city": "Dorogobouge"}, {"long": 34.3, "lat": 55.2, "city": "Wixma"}, {"long": 34.4, "lat": 55.5, "city": "Chjat"}, {"long": 36.0, "lat": 55.5, "city": "Mojaisk"}, {"long": 37.6, "lat": 55.8, "city": "Moscou"}, {"long": 36.6, "lat": 55.3, "city": "Tarantino"}, {"long": 36.5, "lat": 55.0, "city": "Malo-Jarosewii"}]}};
var embedOpt = {"mode": "vega-lite"};
function showError(el, error){
el.innerHTML = ('<div class="error" style="color:red;">'
+ '<p>JavaScript Error: ' + error.message + '</p>'
+ "<p>This usually means there's a typo in your chart specification. "
+ "See the javascript console for the full traceback.</p>"
+ '</div>');
throw error;
}
const el = document.getElementById('vis');
vegaEmbed("#vis", spec, embedOpt)
.catch(error => showError(el, error));
})(vegaEmbed);
</script>
</body>
</html>