Aktualisieren Sie Google Maps mit GeoJSON- oder KML-Dateien mithilfe der JavaScript-API
KML (Keyhole Markup Language) und GeoJSON (Geografisch JSON) sind zwei Dateiformate, die zur strukturierten Speicherung geografischer Daten verwendet werden. Jedes Format eignet sich für verschiedene Arten von Anwendungen und kann in verschiedenen Kartendiensten verwendet werden, darunter Google Maps. Lassen Sie uns in die Details jedes Formats eintauchen und Beispiele liefern:
KML-Datei
KML ist ein XML-basiertes Format zur Darstellung geografischer Daten, das für die Verwendung mit Google Earth entwickelt wurde. Es eignet sich hervorragend zum Anzeigen von Punkten, Linien, Polygonen und Bildern auf Karten. KML-Dateien können Funktionen wie Ortsmarkierungen, Pfade, Polygone, Stile und mehr enthalten.
Beispiel einer KML-Datei:
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2">
<Document>
<name>Example KML</name>
<Placemark>
<name>New York City</name>
<description>New York City</description>
<Point>
<coordinates>-74.006,40.7128,0</coordinates>
</Point>
</Placemark>
</Document>
</kml>
Dieses KML-Beispiel definiert eine einzelne Ortsmarkierung für New York City. Der <coordinates>
Tag gibt den Längengrad, den Breitengrad und die Höhe (in dieser Reihenfolge) an, wobei die Höhe optional ist.
GeoJSON-Datei
GeoJSON ist ein Format zum Kodieren verschiedener geografischer Datenstrukturen mithilfe von JSON. Es unterstützt Geometrietypen wie Point, LineString, Polygon, MultiPoint, MultiLineString, MultiPolygon und GeometryCollection.
Beispiel einer GeoJSON-Datei:
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"properties": {
"name": "New York City",
"description": "New York City"
},
"geometry": {
"type": "Point",
"coordinates": [-74.006, 40.7128]
}
}
]
}
Dieses GeoJSON-Beispiel definiert auch einen einzelnen Punkt für New York City, ähnlich dem KML-Beispiel. Der coordinates
Das Array enthält den Längen- und Breitengrad.
Unterschiede und Verwendung
- KML wird häufig mit Google Earth und anderen Anwendungen verwendet, die umfangreiche geografische Anmerkungen und Stile erfordern. Es eignet sich sehr gut zum Geschichtenerzählen oder für detaillierte geografische Präsentationen.
- GeoJSON ist leichter und wird typischerweise in Webanwendungen verwendet, insbesondere solchen, die JavaScript verwenden. Es ist das bevorzugte Format für webbasierte Kartenanwendungen und GIS Software aufgrund ihrer Einfachheit und Kompatibilität mit der JavaScript-Objektnotation.
Beide Formate sind in verschiedenen Vertriebs- und Marketingstrategien von entscheidender Bedeutung, insbesondere bei der geografischen Zuordnung von Kundendaten, der Analyse von Markttrends oder der Planung standortbezogener Marketingkampagnen. Die Fähigkeit, Daten auf Karten visuell darzustellen, kann in diesen Kontexten ein leistungsstarkes Werkzeug sein und zu einer besseren Entscheidungsfindung und Strategieentwicklung beitragen.
So betten Sie KML oder GeoJSON in Ihre Google Map ein
Um eine KML- oder JSON-Datei mit geografischen Daten mithilfe der Google Maps JavaScript API einzubetten, müssen Sie für jeden Dateityp die folgenden Schritte ausführen:
Einbetten einer KML-Datei
- Bereiten Sie die KML-Datei vor: Stellen Sie sicher, dass Ihre KML-Datei online zugänglich ist. Damit Google Maps es abrufen kann, muss es öffentlich zugänglich sein.
- Erstellen Sie eine Karte: Initialisieren Sie eine neue Google Map in Ihrer Anwendung.
- Laden Sie die KML-Ebene: Verwenden Sie die
google.maps.KmlLayer
Klasse, um Ihre KML-Datei zur Karte hinzuzufügen.
Beispielcode:
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 8,
center: {lat: -34.397, lng: 150.644}
});
var kmlLayer = new google.maps.KmlLayer({
url: 'http://yourdomain.com/path/to/yourfile.kml',
map: map
});
}
Ersetzen 'http://yourdomain.com/path/to/yourfile.kml'
mit der URL Ihrer KML-Datei.
Einbetten einer JSON-Datei
- Bereiten Sie die JSON-Datei vor: Ihr JSON sollte im GeoJSON-Format vorliegen, einem Standardformat zum Kodieren geografischer Daten.
- Erstellen Sie eine Karte: Initialisieren Sie wie beim KML eine Google Map in Ihrer Anwendung.
- Laden Sie die GeoJSON-Ebene: Verwenden Sie die
map.data.loadGeoJson()
Methode zum Hinzufügen Ihrer GeoJSON-Daten zur Karte.
Beispielcode:
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 4,
center: {lat: -28, lng: 137}
});
// Assuming your GeoJSON file is located at the specified URL
map.data.loadGeoJson('http://yourdomain.com/path/to/yourfile.json');
}
Ersetzen 'http://yourdomain.com/path/to/yourfile.json'
mit der URL Ihrer GeoJSON-Datei.
Dinge im Auge zu halten
- Stellen Sie sicher, dass Ihre KML- und GeoJSON-Dateien korrekt formatiert und öffentlich zugänglich sind.
- Der Google Maps-JavaScript-API-Schlüssel ist erforderlich. Fügen Sie es in Ihre ein HTML Datei, in die das Google Maps-Skript geladen wird.
- Passen Sie die Karte an
zoom
undcenter
Eigenschaften entsprechend dem geografischen Standort Ihrer Daten.
Durch die Integration von KML- oder GeoJSON-Dateien auf diese Weise können Sie umfangreiche geografische Daten effektiv in Ihrer Webanwendung anzeigen und Benutzern ein dynamisches und interaktives Kartenerlebnis bieten. Dies kann besonders in verschiedenen Vertriebs- und Marketingkontexten nützlich sein, in denen die Visualisierung geografischer Daten das Verständnis und die Einbindung potenzieller Kunden oder Teammitglieder verbessern kann.