-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
189 lines (152 loc) · 10.9 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Maphub - Historic Map Annotation Portal</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Maphub in an online application for exploring and annotating digitized, high-resolution historic maps">
<meta name="author" content="Bernhard Haslhofer, Werner Robitza">
<!-- Le JS -->
<script src="bootstrap/js/bootstrap.js"></script>
<!-- Le styles -->
<link href="bootstrap/css/bootstrap.css" rel="stylesheet">
<link rel="stylesheet" href="style/style.css" />
<link href="bootstrap/css/bootstrap-responsive.css" rel="stylesheet">
<!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- Le fav and touch icons -->
<link rel="shortcut icon" href="images/favicon.ico">
<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
<link href='http://fonts.googleapis.com/css?family=Architects+Daughter' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Gentium+Basic' rel='stylesheet' type='text/css'>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-33528080-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body>
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container" id="nav_container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="index.html">maphub</a>
<div class="nav-collapse">
<ul class="nav pull-right">
<li><a href="https://github.com/maphub/maphub-portal">Code</a></li>
<li><a href="http://maphub.herokuapp.com/">Demo</a></li>
<li><a href="http://maphub.github.com/api/">API</a></li>
<li><a href="https://github.com/maphub/maphub-portal/issues">Issues</a></li>
</ul>
</div><!--/.nav-collapse -->
</div><!-- container -->
</div>
</div>
<div class="container">
<div class="topPart">
<iframe src="http://player.vimeo.com/video/46114369?color=ffffff" width="945" height="531" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
</div><!-- topPart -->
<div class="main_body">
<div class="padding"></div>
<!-- Example row of columns -->
<div class="row">
<div class="about">
<div class="span4" style="float:left">
<h2>Annotation</h2>
<div>
<p>Annotations can easily be added by creating overlays on top of map images.</p>
<p><img class="dem" src="img/annotation_buttons.png" alt="buttons"/><img class="dem" src="img/alaska_annotation.png" alt="sample_annotation"/></p>
<p>A window will pop up, prompting you to add an annotation for that region. While you are typing your annotation, Maphub will suggest possibly relevant <a href="http://www.wikipedia.org/">Wikipedia</a> tags for your annotation.</p>
<p><img class="dem" src="img/tags.png" alt="example_tags"/></p>
<p>You can either accept or deny these tags. Accepted tags will then be linked to the annotation and support multilingual map search and retrieval.</p>
</div>
</div><!--span4-->
<div class="span4" style="float:right">
<h2>GeoReferencing</h2>
<div>
<p>Control points may be added to each map.</p>
<p><img class="dem" src="img/control_point.png" alt="example_controlPoint"/></p>
<p>Each control point is associated with known geographic coordinates.</p>
<p><img class="dem" src="img/control_pick.png" alt="picking_location"/></p>
<p>After at least three of these points are added to the map, a geographic model can be computed for the map. Maphub will then be able to prompt the user with more locations as well as generate possible tag choices for annotations.</p>
<p><img class="dem" src="img/three_points.png" alt="display_controlPoints"/></p>
</div>
</div><!--span4-->
</div><!-- About -->
</div>
<div class="padding"></div>
<div class="padding"></div>
<div class="row">
<div class="about">
<div class="span4" style="float:left">
<h2>Multilingual Search</h2>
<div>
<p>Annotations and Control Points connect maps with globally connected data sources - such as <a href="http://dbpedia.org/About">DBpedia</a>. It is then possible to exploit those connections to enrich annotations and their tags with additional information, such as the ability to search for a map by its content and not its title, and translations of terms in other languages.</p>
<p>Searching for the term Mediterranean Sea</p>
<p><img src="img/english.png"></p>
<p>will return the Waldseemüller map in any Wikipedia-supported lanuguage since it has a tag linking the term to the map.</p>
<p>For example: Russian,</p>
<p><img src="img/russian.png"></p>
<!--
<p>German,</p>
<p><img src="img/german.png"></p>
-->
<p>or Japanese...</p>
<p><img src="img/japanese.png"></p>
</div>
</div>
<div class="span4" style="float:right">
<h2>Map Overlays</h2>
<div>
<p>After adding at least three control points to a map it is possible to calculate real world locations for any point on the map. This allows us to create different views through <a href="https://maps.google.com/">Google Maps</a> </p>
<p><img src="img/googlemaps.png"></p>
<p>and <a href="http://www.google.com/earth/index.html">Google Earth</a>.</p>
<p><img src="img/googleearth.png"></p>
<p>These views will create an overlay of the historic map onto its current day location. The Google Earth file can also be downloaded to your computer for a later viewing.</p>
<p><img src="img/XML.png"></p>
</div>
</div>
</div>
</div><!-- About -->
<div class="padding"></div>
<div class="padding"></div>
<div class="row">
<div class="about">
<div class="span4" style="float:left">
<h2>About Maphub</h2>
<div>
<p>Maphub in an online application for exploring and annotating digitized, high-resolution historic maps. All user-contributed annotations are shared via the <a href="http://maphub.github.com/api/" title="Maphub Open Annotation API Documentation">Maphub Open Annotation API</a>. The <a href="http://maphubdev.mminf.univie.ac.at/" title="maphub">first demo</a> has been bootstrapped with approximately 6000 public domain maps taken from the <a href="http://memory.loc.gov/ammem/gmdhtml/" title="Map Collections Home Page">Library of Congress Historic Map division</a>.</p>
</div>
</div>
<div class="span4" style="float:right">
<h2>Technical Details</h2>
<div>
<p>Maphub is implemented on the <a href="http://rubyonrails.org/" title="Ruby on Rails">Ruby on Rails</a> web framework and uses <a href="http://lucene.apache.org/solr/" title="Apache Lucene - Apache Solr">Apache Solr</a> for map full-text search. Tag suggestions are coming from <a href="http://www.geonames.org/" title="GeoNames">Geonames</a> and <a href="http://wikipedia-miner.cms.waikato.ac.nz/" title="Wikipedia Miner">Wikiminer</a> and semantic tag enrichments are retrieved from <a href="http://dbpedia.org/" title="">DBPedia</a>. <a href="http://code.google.com/p/magicktiler/" title="magicktiler - A Java tool and embeddable library for converting images into formats suitable for publishing as zoomable Web images. - Google Project Hosting">magicktiler</a> and <a href="http://openlayers.org/" title="OpenLayers: Home">OpenLayers</a> are used to create and display zoomable raster images. Google Map/Earth overlays are being generated using <a href="http://www.klokan.cz/projects/gdal2tiles/" title="GDAL2Tiles - Publish Maps by Google Earth (KML SuperOverlay), Google Maps or OpenLayers as online static files (pyramid tile structure generator)">GDAL2Tiles</a>. The Maphub Open Annotation API follows the <a href="http://www.openannotation.org/spec/core/" title="Open Annotation Draft Data Model">W3C Open Annotation</a> specification. Maphub reuses code previously developed for the <a href="https://github.com/yuma-annotation">YUMA annotation framework</a>. </p>
</div>
</div>
</div>
</div><!-- About -->
<footer class="footer">
<p>Maphub is being developed at <a href="http://www.infosci.cornell.edu/" title="Cornell University - Information Science - Overview">Cornell Information Science</a>, with support from the <a href="http://illinois.edu/" title="University of Illinois at Urbana-Champaign">University of Illinois at Urbana-Champaign</a> and the <a href="http://www.univie.ac.at/en/" title="University of Vienna">University of Vienna</a>.</p>
<p>This work is supported by the <a href="http://www.openannotation.org/" title="Welcome">Open Annotation Collaboration</a> through a generous grant from the <a href="http://www.mellon.org/" title="About the Foundation — The Andrew W. Mellon Foundation">Andrew W. Mellon Foundation</a>. It is licensed under a <a href="http://creativecommons.org/licenses/by-sa/3.0/" title="Creative Commons — Attribution-ShareAlike 3.0 Unported
— CC BY-SA 3.0">Creative Commons Attribution-Share Alike 3.0 Unported License</a>.</p>
<p>All software is distributed under the <a href="http://www.apache.org/licenses/LICENSE-2.0.html" title="Apache License, Version 2.0">Apache License, Version 2.0</a>.</p>
<p>To get in contact, please write to <code>bernhard.haslhofer</code> at <code>cornell.edu</code>.</p>
</footer>
</div>
</div> <!-- /container -->
</body>
</html>