-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
80 lines (74 loc) · 4.43 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
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="lib/leaflet/leaflet.css" />
<script src="lib/leaflet/leaflet.js"></script>
<script src="lib/leaflet-side-by-side.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title></title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div> <h1>Minecraft vs Real Life Maps</h1></div>
<img src="img/map.png" class="img2" style="width: 580px; height: 580px">
<div>
<p>
Maps are an item in the video game Minecraft that by holding in<br>
a players hand automatically map the surround area. The image above<br>
is an example of what holding a map looks like in game.<br>
This map is at 1:4 scale which means that for every one square on<br>
the map it represents 4 blocks in Minecraft. Each Minecraft<br>
block represents 1 meter in real life.
</p>
</div>
<br></br>
</div>
<div id="map" class=center></div>
<div>
<p>
This map shows an idealized example of what a map looks like and represents <br>
in Minecraft. If you hover over a feature you can see what block is being <br>
represented. This map is at 1:1 scale meaning every square on the map is <br>
one block in Minecraft. Instead of showing actual imagery, Minecraft maps <br>
show a classified raster. The raster isn't classified very well however<br>
as multiple blocks that are similar colors or share a common type tend to<br>
have the same color on the map. If you hover over either gray patch, for example,<br>
it will say "Stone and Gravel" as both blocks are the same color on the map.<br>
In reality the leftmost patch is stone and the rightmost gravel.
</p>
</div>
<br></br>
<div>
<img src="img/reference.png" class="img2" style="width: 700px; height: 500px">
</div>
<div>
<p>
This reference image allows us to use ground truthing to determine<br>
what detail is lost in the map. This image is taken from what is <br>
at the bottom of the map looking north. You may start to see how <br>
Minecraft maps represent features like topology and water depth. <br>
They show hills by adding darker and lighter shading on either <br>
side. For water depth the darker the blue, the deeper the water. <br>
For the function maps in Minecraft serve, this is all the detail <br>
that is necessary, but what if you could could make a map of a real<br>
area look like this?
</p>
</div>
<br></br>
<div id="map2" class="center2"></div>
<div>
<p>
This is an example of what a real place may look like if it <br>
where classified like a Minecraft map. You can see how it is far from <br>
perfect for many reasons. This was made using one of many Minecraft Maps<br>
created by Mattias Brennecke on his website called <a href=https://earth.motfe.net>Minecraft Earth Map</a>.<br>
The area on the map shown is around the city of Tillamook on the Oregon Coast.<br>
The satellite image was taken from Sentinel 2. The Minecraft Map I used<br>
is at 1:500 scale meaning that there are 500 meters in real life for every<br>
one square on the map.
</p>
</div>
<script src="js/main.js"></script>
</body>
</html>