DOCTYPE-Problem mit OpenLayers

Communities Deutschland (Germany)
1

Hallo :slight_smile:

Ich will mittels OpenLayers eine Karte in eine Webseite einbinden. Ich habe das OpenLayers-Beispiel aus dem Wiki genommen und etwas angepasst (den Code zum Laden der Karte in eine extra JavaScript-Datei ausgelagert). Also gibt es ein

setupMap.js:

function setupMap()
{

	map = new OpenLayers.Map("map");
	map.addLayer(new OpenLayers.Layer.OSM());

	var lonLat = new OpenLayers.LonLat(11.7450785, 50.3158229).transform(
		new OpenLayers.Projection("EPSG:4326"),
		map.getProjectionObject()
	);
	var zoom = 16;
	var markers = new OpenLayers.Layer.Markers("Markers");

	map.addLayer(markers);
	markers.addMarker(new OpenLayers.Marker(lonLat));
	map.setCenter (lonLat, zoom);

}

Und hier die HTML-Datei:

<?xml version="1.0" encoding="utf-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>
<script src="http://www.openlayers.org/api/OpenLayers.js" type="text/javascript"></script>
<script src="setupMap.js" type="text/javascript"></script>
</head>

<body onload="setupMap();">
<div id="map"></div>
</body>

</html>

Nur leider funktioniert das nicht … lässt man allerdings die DOCTYPE-Angabe weg, also das

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

dann wird die Karte geladen.

Warum?!

Vielen Dank für alle Hilfe!

2

Okay, doch selbst gelöst! Man muss einfach die Größe des Map-divs explizit angeben. Also z. B. mittels

#map {
	width: 100px;
	height: 100px;
}

Ich lasse den Post mal stehen, vielleicht stolpert ja noch jemand anderes über dieses Problem?

3

Welcher Browser?

Habe selbst schon Unterschiede beobachtet: Ohne explizite Angabe der Größe, FF funktioniert, im IE ist keine Karte zu sehen.

bye, Nop

4

Nahmd,

Wahrscheinlich hat der IE sogar recht. :confused:

Die Situation ist eine lustige: die Höhe des Map-Elementes wird vom Inhalt bestimmt, das Element wird wird also “aufgedrückt”. Der Viewport im Inneren aber hat eine Höhenangabe von “100%”, die wird also vom Map-Objekt bestimmt. Da beißt sich die Katze in den Schwanz. :slight_smile:

Der FF sucht offensichtlich bei einer Prozentangabe nach dem nächsten umgebenden Element, das eine sinnvolle Höhe hat (ist oft das ) und bezieht sich darauf.

Während der IE die 100% auf das direkt umgebende Element bezieht und 100% von 0 = 0 berechnet.

Übrigens kann man das IE-Verhalten im FF nachbilden, indem man dem Map-

ein “position: absolute” in den Style schreibt. Dann zeigt auch der keine Karte mehr an.

Also: brav immer die Höhe angeben.

Gruß Wolf

5

IE hat nie recht. :slight_smile:

In meinem Fall waren genügend relative Abstandsangaben vorhanden, um die Breite korrekt auszurechnen. Der IE hat nur darauf verzichtet.

bye, Nop