Externe API-Daten zu google map

Question

ich ein Polygon erstellt auf Google Maps Daten von einem externen API http://geokey.org.uk/docs/web/project-response.html

die API-Antwort gibt die folgende Verwendung versuchen:

{ 
"id": 28, 
"name": "Local spots", 
"description": "", 
"isprivate": true, 
"status": "active", 
"created_at": "2014-09-15T09:40:01.747Z", 
"geographic_extent": { 
    "type": "Polygon", 
    "coordinates": [ 
     [ 
      [-0.508, 51.682], 
      [-0.53, 51.327], 
      [0.225, 51.323], 
      [0.167, 51.667], 
      [-0.508, 51.682] 
     ] 
    ] 
}, 

Wie extrahieren i geographic_extent - Koordinaten und render sie als Polygon auf Google Map? - Ich verstehe, dass es ein AJAX sein sollte, aber Get get würde eine ganze Reihe zurückgeben?

Hilfe wird sehr geschätzt.

Dank

Script für generaing die var map Karte ;

function initMap() { 
      map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 2, 
      center: new google.maps.LatLng(2.8,-187.3), 
     }); 
    } 

Answer 1

Um die ‚geographic_extent‘ Knoten aus der Ajax-Antwort extrahieren erhalten Sie die JSON.parse Funktion nutzen zu können. z.B.;

var result = JSON.parse('{"id": 28,"name": "Local spots","description": "","isprivate": true,"status": "active","created_at": "2014-09-15T09:40:01.747Z","geographic_extent": {"type": "Polygon", "coordinates": [[[-0.508, 51.682],[-0.53, 51.327],[0.225, 51.323],[0.167, 51.667],[-0.508, 51.682]]]}'); 

jetzt können Sie

-0.508,51.682,-0.53,51.327,0.225,51.323,0.167,51.667,-0.508,51.682 

mit

result.geographic_extent.coordinates 

bekommen Denn es als Polygon Plotten, verwenden Sie den folgenden Code

var triangleCoords = [ 
      {lat: 25.774, lng: -80.190}, 
      {lat: 18.466, lng: -66.118}, 
      {lat: 32.321, lng: -64.757}, 
      {lat: 25.774, lng: -80.190} 
     ]; 


     var bermudaTriangle = new google.maps.Polygon({ 
      paths: triangleCoords, 
      strokeColor: '#FF0000', 
      strokeOpacity: 0.8, 
      strokeWeight: 2, 
      fillColor: '#FF0000', 
      fillOpacity: 0.35 
     }); 
     bermudaTriangle.setMap(map); 

Beachten Sie die Art und Weise triangleCoords definiert sind , es ist eine Anordnung von Lat, lng Objekt. Wenn Sie das von Ihrer Ajax-Anfrage empfangene Polygon plotten möchten, müssen Sie es in ein ähnliches Array von Lat, lng-Objekten einfügen.

http://jsbin.com/kupeyofemo/edit?html,output