1. Home
  2. Dokumente
  3. Karten
  4. Kartenansicht

Kartenansicht

Beschreibung

Eine grundlegende Eigenschaft der SmartMaps-API ist das Anzeigen eines Kartenausschnitts.

Nach der Anzeige der Karte können verschiedene Objekte in die Karte eingezeichnet werden. Hierzu gehören Icons, DIV-Elemente, GeoJSON-Objekte, Polylinien oder Polygone. Letztere unterscheiden sich von Polylinien dadurch, dass sie eine Füllfarbe haben können. Die Auflistung der weiteren Objekte finden Sie im Namensraum ym.modules.provider.

Die Klassen des Namensraums ym.modules.provider enthalten auch die Methoden, die es ermöglichen, die Objekte der Karte hinzuzufügen.

Beispiel

Im folgenden Beispiel erscheint die Karte im DIV-Element mit der ID map. Beachten Sie, dass Sie für die Karte eine Höhe festlegen müssen, damit sie sichtbar wird. Zur Initialisierung der Karte benötigt man einen Kartenmittelpunkt und eine Zoomstufe.

Das Beispiel ist vollständig; Sie können es lokal in einer Datei abspeichern und im Browser aufrufen. Sie müssen lediglich den Wert für den apiKey ersetzen.

<!DOCTYPE html>
<html>
<head lang="en">
	<meta charset="UTF-8" />
</head>
<body>
	<!-- Stelle, an der die Karte angezeigt werden soll. Auf die ID wird unten im Skript verwiesen. -->
	<div id="map" style="height: 400px; width: 500px;"></div>

	<!-- Laden der API. -->
	<script src="https://api.yellowmaps.eu/api_rst/api/loader/?apiKey={API_KEY}&libraries=free-3"></script>

	<!-- Zugriff auf die SmartMaps-API. Anzeige der Karte. -->
	<script>
		ym.ready(function (modules) {
			var provider = modules.provider; 
			// Kurzform: ym.latLng(49.001, 8.417);
			var center = ym.latLng(49.001, 8.417);
			// Kurzform: ym.map(...);

			// Mittelpunkt und Zoomstufe sind nicht optional.
			var map = new provider.Map("map", {
			center: center,
			zoom: 12
			});

			window.map = map;
		});
	</script>
</body>
</html>

Weitere Informationen

Beispielszenarios

Initialisierung

Eigenschaften

Ereignisse

Methoden

Wie können wir helfen?