Information Technology Reference
In-Depth Information
Dem
OpenLayers.Map
-Objekt wird ähnlich wie bei Google Maps ein HTML-
div
-
Element zur Darstellung zugewiesen und ein Layer vom Typ
Osmarender
hinzu-
gefügt, der Standard-Kartenansicht von OpenStreetMap (
OSM
). Hier kommt eine
Besonderheit von OpenStreetMap ins Spiel: Wie schon in Abschnitt 7.1.1, Ein
Wort zu geografischen Daten, erwähnt wurde, müssen dreidimensionale Infor-
mationen projiziert werden, um sie am Bildschirm in 2D darzustellen. Während
Google Maps den Anwender nicht mit diesen Details belästigt und man ganz
einfach die X- und Y-Koordination in Dezimalgrad angibt, verlangt OpenLayers,
dass Angaben in Dezimalgrad zuerst in das entsprechende Koordinatensys-
tem projiziert werden. Intern verwendet OpenLayers genauso wie Google Maps,
Yahoo! Maps und Microsoft Bing Maps für die Kartendarstellung eine Projek-
tion, die als
Spherical Mercator
(
EPSG
-Code 3785) bezeichnet wird. In Spherical
Mercator werden Koordinaten nicht in Dezimalgrad, sondern in Metern verwal-
tet, weshalb die hier verwendeten Gradangaben mit dem Aufruf
transform()
unter Angabe des
EPSG
-Codes der gewünschten Projektion (
EPSG:4326
) in das
in der Karte verwendete Koordinatensystem (ermittelt durch die Funktion
map.
getProjectionObject()
) konvertiert werden müssen.
ACHTUNG
Wird der für HTML5 korrekte
DOCTYPE
am Beginn des Dokuments verwendet,
muss das HTML-Element, in dem die Karte angezeigt wird, eine Positionierung
von
fixed
oder
absolute
aufweisen. Anderenfalls zeigt die OpenLayers-Bibliothek
gar nichts an. Interessanterweise fällt diese Einschränkung weg, wenn kein
DOC-
TYPE
angegeben wird.
http://openlayers.org/pipermail/users/2009-July/012901.html
7.2
Ein erster Versuch: Positionsausgabe
im Browser
Um die Geolocation-Funktion des Browsers zu testen, reicht folgender Java-
Script-Code aus:
function $(id) { return document.getElementById(id); }
window.onload = function() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(
function(pos) {
$("lat").innerHTML = pos.coords.latitude;
$("lon").innerHTML = pos.coords.longitude;
$("alt").innerHTML = pos.coords.altitude;
},
