Google Map API Rectangle Klasse

-1

Ich habe ein ziehbares Rechteck auf meiner Karte. Wenn der Benutzer das Rechteck in eine quadratische Form zieht, weiß ich, dass beide Seiten gleich sind. Wie kann ich die Länge einer Seite im Vergleich zur anderen bestimmen? Ich kann getBounds verwenden und wahrscheinlich etwas damit anfangen, aber ich nehme an, dass es einen einfacheren Weg gibt. Ich brauche nicht die tatsächliche Nummer, ich muss nur relativ zueinander wissen. Zum Beispiel ist das Rechteck doppelt so breit wie hoch oder dreimal so groß wie breit.Google Map API Rectangle Klasse

Quelle

2016-04-11 user1892770

Was sehen Sie den Code funktioniert wie bisher? – duncan

Wahrscheinlich müssen Sie die [computeDistanceBetween"Funktion der Funktion [Geometry library] (https://developers.google.com/maps/documentation/javascript/geometry#Distance) verwenden – duncan

Danke Duncan, ich habe computeDistanceBetween vom "Most Excellent" -Beispiel verwendet auf Ihrem Blog unter: [link] (https://duncan99.wordpress.com/tag/google-maps-api) – user1892770

Angenommen, Sie haben ein ziehbares Rechteck, können Sie seine Grenzen erhalten, wenn der Benutzer es gezogen hat. Dann könnten Sie die Geometrie-Bibliothek verwenden, um die Länge ihrer Seiten zu erhalten. Etwas wie:

<!DOCTYPE html> 
<html> 
<head> 
<title></title> 

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<style type="text/css"> 
html { height: 90% } 
body { height: 100%; margin: 0; padding: 0 } 
#map { height: 100% } 
</style> 

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=geometry"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 

<script> 
    function initialize() { 
     var myOptions = { 
      zoom: 14, 
      center: {lat: 51.476706, lng: 0}, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var map = new google.maps.Map(document.getElementById("map"), myOptions); 

     var rectangle = new google.maps.Rectangle({ 
      bounds: new google.maps.LatLngBounds(
       {lat: 51.4721885614119, lng: -0.029311180114746094}, 
       {lat: 51.48122299123414, lng: 0.029311180114746094} 
      ), 
      editable: true, 
      map: map 
     }); 

     rectangle.addListener('bounds_changed', function() {    
      var bounds = this.getBounds(); 

      var proportion = getSideProportions(bounds); 

      $('#proportion').text('The width is ' + proportion + ' times the height'); 
     }); 
    } 

    /* Imagine a rectangle with these corners: 
    * A--B 
    * | | 
    * C--D 
    * PointB = the North-East corner, 
    * PointC = the South-West corner 
    */ 
    function getSideProportions(bounds) { 
     var PointA, PointB, PointC, NorthEastLatitude, SouthWestLongitude, horizontalDistance, verticalDistance, proportion; 

     // get the coordinates for the NE and SW corners 
     PointB = bounds.getNorthEast(); 
     PointC = bounds.getSouthWest(); 

     // from that, figure out the latitudes and the longitudes 
     NorthEastLatitude = PointB.lat(); 

     SouthWestLongitude = PointC.lng(); 

     PointA = new google.maps.LatLng(NorthEastLatitude, SouthWestLongitude); 

     horizontalDistance = getDistance(PointA, PointB); 
     verticalDistance = getDistance(PointA, PointC); 

     proportion = horizontalDistance/verticalDistance; 

     return Math.round(proportion * 10)/10; 
    } 

    function getDistance(point1, point2) { 
     return google.maps.geometry.spherical.computeDistanceBetween(point1, point2); 
    } 

    google.maps.event.addDomListener(window, 'load', initialize); 
</script> 
</head> 
<body> 
    <div id="map"></div> 
    <div id="proportion"></div> 
</body> 
</html>

Ref: https://duncan99.wordpress.com/2013/10/19/google-maps-size/

Quelle

2016-04-11 18:43:04 duncan

Danke! Ausgezeichneter Code. – user1892770

Google Map API Rectangle Klasse

Antwort

Verwandte Themen