Wie füge ich Kreise mit unterschiedlichen Radien um KML-Datenpunkte hinzu?

Question

Ich habe eine Liste von Adressen, die auf einer Karte platziert und mit einem Kreis um die verschiedenen Radien angezeigt werden müssen.

Ich habe eine KML-Datei, die alle meine Punkte auflistet und ich möchte ein benutzerdefiniertes Feld "Radius" innerhalb der KML hinzufügen und in der Lage sein, einen Kreis um jeden Punkt basierend auf dem benutzerdefinierten Feld zu zeichnen.

Bin ich auf dem richtigen Weg oder gibt es einen einfacheren Weg?

Answer 1

Hängt davon ab, wie viele Adressen Sie haben. Wenn Ihre KML-Datei mehrere Megabyte groß ist, sind Sie möglicherweise auf dem richtigen Weg. Mit KmlLayer in der Google Maps-API erhalten Sie jedoch keinen direkten Zugriff auf die Daten in den Punkten. Daher ist es nicht möglich, ein benutzerdefiniertes Radiusfeld hinzuzufügen. Es sieht so aus, als wäre es besser, die einzelnen Punkte als Adressen darzustellen. Dies sind einige der Artikel, die nützlich sein könnten: https://developers.google.com/maps/articles/toomanymarkers https://developers.google.com/maps/articles/phpsqlsearch_v3 https://developers.google.com/maps/articles/phpsqlgeocode

Und dann ein Kreis Objekt um es zu schaffen.

Answer 2

Es ist sehr gut möglich, Kreise um KML-Ortsmarken zu zeichnen. Ich benutzte die geoxml3 processor. Zuerst

• geoxml3 verwendet Ajax, so Tests durch Ihre Karte HTML aus dem Browser öffnen wird nicht funktionieren.
• Ich empfehle, die folgende Version von geoxml3 herunterzuladen, das was für mich gearbeitet ist: http://geoxml3.googlecode.com/svn/branches/polys/geoxml3.js

Es ist für KMZ-Dateien eine andere Version, und "network_link". (Ich habe das nicht versucht).

Es gibt schlechte Nachrichten, die ich festgestellt habe, dass es keine Möglichkeit gibt, benutzerdefinierte Tags einzufügen und geoxml3 finden sie. Um also die Kreisradien variabel zu machen, müssen Sie diese Informationen in das "description" -Tag eingeben und analysieren, indem Sie beim Kombinieren von Daten reguläre Ausdrücke verwenden. Es gibt zwei andere weniger geeignete Optionen: "Name" und "styleUrl".

Dies ist die einfache Seite, die ich zusammengestellt habe. https://files.nyu.edu/hc742/public/googlemaps/kmlcircle.html

Das Javascript sieht so aus, der wichtige Teil ist die Callback-Funktion "createMarker" in den geoXml-Optionen.

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
    <script type="text/javascript" src="geoxml3.js"></script> 
    <script type="text/javascript"> 
    var map; 
    var geoXml = null; 
    var mapOptions = { center: new google.maps.LatLng(39.370, -100.0), zoom: 5, 
    mapTypeId: google.maps.MapTypeId.ROADMAP }; 

    function initialize() { 
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 
    geoXml = new geoXML3.parser({ 
     map: map, 
     createMarker: addCircle}); 

    geoXml.parse('https://files.nyu.edu/hc742/public/googlemaps/simple.kml') 
    } 


    function addCircle(placemark) { 
    //rad = parseFloat(placemark.description); 
    rad = parseFloat(placemark.styleUrl); 
    marker = new google.maps.Marker({map:map, position:placemark.latlng}); 
    circle = new google.maps.Circle({map:map, center: placemark.latlng, radius: rad}); 
    } 

    google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 

Mit dieser KML:

<?xml version="1.0" encoding="UTF-8"?> 
<kml xmlns="http://earth.google.com/kml/2.0"> 
    <Document> 
    <name>simple</name> 
    <description>nothing</description> 

    <Placemark> 
     <name>simple</name> 
     <description>2000</description> 
     <styleUrl>8000</styleUrl> 

     <Point> 
     <coordinates>-122.0822035425683,37.42228990140251,1220</coordinates> 
     </Point> 
    </Placemark> 

    <Placemark> 
     <name>simple</name> 
     <description>5001</description> 
     <styleUrl>3000</styleUrl> 
     <Point> 
     <coordinates>-122.0822035425683,37.22228990140251,4330</coordinates> 
     </Point> 
    </Placemark> 

    <Placemark> 
     <name>C</name> 
     <description>9001</description> 
     <styleUrl>2000</styleUrl> 

     <Point> 
     <coordinates>-122.00000000001,37.000000000001,9001</coordinates> 
     </Point> 
    </Placemark> 
    </Document> 
</kml>