Google Maps Prostokąt edytowalny: jak zablokować (naprawić) wysokość od edycji

Question

Mam Mapę Google, w niej prostokąt, który można edytować, przenosić i zmieniać rozmiar itp. To, czego szukam, to sposób na zablokowanie danej wysokości prostokąta, więc tylko szerokość może zostać zmieniona.

Answer 1

Możesz zapobiec zmianie rozmiaru prostokąta za pomocą zdarzenia bounds_changed w JavaScript.

Oto jsfiddle robocze: http://jsfiddle.net/h7ee4368/

prostokąt odniesienia API: https://developers.google.com/maps/documentation/javascript/reference?hl=de#Rectangle

JavaScript src:

var rectangle; 
var originalBounds; 
var map; 

function initialize() { 
    var mapOptions = { 
     center: new google.maps.LatLng(44.5452, -78.5389), 
     zoom: 9 
    }; 
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

    var bounds = new google.maps.LatLngBounds(
     new google.maps.LatLng(44.490, -78.649), 
     new google.maps.LatLng(44.599, -78.443) 
    ); 

    originalBounds = bounds; 

    // Define the rectangle and set its editable property to true. 
    rectangle = new google.maps.Rectangle({ 
     bounds: bounds, 
     editable: true, 
     draggable: true 
    }); 

    rectangle.setMap(map); 

    // Add an event listener on the rectangle. 
    google.maps.event.addListener(rectangle, 'bounds_changed', boundsChangedCb); 
} 

var skipBoundsChangedCb = false; 
function boundsChangedCb(event) { 
    if(skipBoundsChangedCb) return; 

    var ne = rectangle.getBounds().getNorthEast(); 
    var sw = rectangle.getBounds().getSouthWest(); 

    var origNe = originalBounds.getNorthEast(); 
    var origSw = originalBounds.getSouthWest(); 

    //avoid recursion 
    skipBoundsChangedCb = true; 

    rectangle.setBounds(new google.maps.LatLngBounds(
     new google.maps.LatLng(ne.lat() - origNe.lat() + origSw.lat(), sw.lng()), 
     ne   
    )); 

    skipBoundsChangedCb = false; 

    origNe = ne; 
    origSw = sw; 
} 

google.maps.event.addDomListener(window, 'load', initialize);