Geofencing avec Google Maps

Question

J'essaie de laisser les gens dessiner un rectangle sur Google Maps et stocker les coordonnées bottomLeft et topRight.

Je sais que je peux dessiner un codewise rectangle (voir: http://code.google.com/intl/nl-NL/apis/maps/documentation/javascript/reference.html#Rectangle), mais avant que je puisse charger les limites de mon DB les gens ont besoin de définir themself d'abord bien sûr :)

Donc ma question est, comment puis-je laisser les gens dessiner un rectangle sur Google Maps (API v3) et stocker les coordonnées des coins bottomLeft et topRight?

Answer 1

Déjà commencé à travailler en regardant dans les événements. A pris beaucoup de mon temps à faire :)

Voici comment je l'ai fait pour les personnes qui en ont besoin à:

function mapsInitialize() 
{ 
    startPoint = new google.maps.LatLng(lat,lon); 
    options = { zoom: 16, center: startPoint, mapTypeId: google.maps.MapTypeId.HYBRID}; 
    map = new google.maps.Map(document.getElementById("map_canvas"), options); 


    google.maps.event.addListener(map, 'click', function(event) { 
     if (drawing == true){ 
      placeMarker(event.latLng); 
      if (bottomLeft == null) { 
       bottomLeft = new google.maps.LatLng(event.latLng.Oa, event.latLng.Pa); 
      } 
      else if (topRight == null){ 
       topRight = new google.maps.LatLng(event.latLng.Oa, event.latLng.Pa); 
       drawing = false; 
       rectangle = new google.maps.Rectangle(); 

       var bounds = new google.maps.LatLngBounds(bottomLeft, topRight); 

       var rectOptions = { 
        strokeColor: "#FF0000", 
        strokeOpacity: 0.8, 
        strokeWeight: 2, 
        fillColor: "#FF0000", 
        fillOpacity: 0.35, 
        map: map, 
        bounds: bounds 
       }; 
       rectangle.setOptions(rectOptions); 
      } 
     } 
    }); 
} 

function placeMarker(location) { 
    var marker = new google.maps.Marker({ 
     position: location, 
     map: map 
    }); 
} 

Answer 2

Si je vous comprends bien - Vous avez besoin d'un moyen d'amener les utilisateurs à entrer une polyligne/polygone. Si c'est le cas - jetez un oeil à ce example, où polygone est créé en cliquant sur une carte. Il utilise une classe PolygonCreator et jquery. Vous pouvez adopter cette méthode, et enregistrer le résultat dans le champ de formulaire (il existe un certain nombre d'options: JSON ou votre propre méthode de sérialisation)

Si vous avez juste besoin de montrer ces polygones sur la carte et rien de plus: vous pouvez même prendre avantage de geometry.encoding library et de stocker les polylines codées dans la base de données. Ou, si vous allez utiliser des requêtes spatiales (par exemple - détecter si un point tombe dans vos polygones), vous pouvez utiliser une extension spatiale quelconque: MySQL spatial extensions, PostGIS, etc. Dans MySQL vous pouvez stocker une polyligne dans Polyline ou Polygon colonnes typées , qui est basé sur les formats OpenGIS. Franchement, ici, sur stackoverflow, il y a tout un tas d'informations connexes.