Rimuovi rettangolo da Google Maps

Question

Sto utilizzando Google Maps v3 (javascript). Vorrei attirare un rettangolo nel modo seguente quando si carica la mia mappa:

<script type="text/javascript"> 
    // Global variables 
    var map; 

    /** 
    * Called on the initial page load. 
    */ 
    function init() { 

    map = new google.maps.Map(document.getElementById('map'), { 
     'zoom': 6, 
     'center': new google.maps.LatLng(41.87194,12.567379999999957), 
     'mapTypeId': google.maps.MapTypeId.ROADMAP 
    }); 

    //Region Overlay 
    var latLng1; 
    var latLng2; 

    <?php foreach ($this->arrRegion as $region) { ?> 
     latLng1 = new google.maps.LatLng(<?php echo $region['boundLat1_region']; ?>,<?php echo $region['boundLng1_region']; ?>); 
     latLng2 = new google.maps.LatLng(<?php echo $region['boundLat2_region']; ?>,<?php echo $region['boundLng2_region']; ?>); 
     redraw(latLng1,latLng2); 
    <?php }?> 

    } 

    /** 
    * Updates the Rectangle's bounds to resize its dimensions. 
    */ 
    function redraw(latLng1,latLng2) { 
    var latLngBounds = new google.maps.LatLngBounds(latLng1,latLng2); 
    // Create a new Rectangle overlay 
    var rectangle = new google.maps.Rectangle({map: map, bounds: latLngBounds}); 
    } 

    // Register an event listener to fire when the page finishes loading. 
    google.maps.event.addDomListener(window, 'load', init); 
</script> 

Ora, il mio obiettivo è quello di rimuovere il rettangolo. Cerco di usare map.clear ma non ha funzionato. Qualche suggerimento?

Answer 1

classe Il google.maps.Rectangle ha un metodo setMap. Se si passa null a questo, il rettangolo viene rimosso. Vedi http://code.google.com/apis/maps/documentation/javascript/reference.html#Rectangle

Nota che questo significa che è necessario mantenere le istanze dei rettangoli in modo che sia possibile chiamare il metodo setMap. La variabile di rettangolo locale nella tua funzione di ridisegno non la manterrà intorno, a meno che non chiami il ridisegno con le stesse coppie di latLng.

Answer 2

È possibile utilizzare la funzione setMap() con parametro di input null ad ogni chiamata di ridisegno().

// Global variables 
 
    var map; 
 
    var rectangle; 
 

 
    /** 
 
    * Called on the initial page load. 
 
    */ 
 
    function init() { 
 

 
    map = new google.maps.Map(document.getElementById('map'), { 
 
     'zoom': 6, 
 
     'center': new google.maps.LatLng(41.87194,12.567379999999957), 
 
     'mapTypeId': google.maps.MapTypeId.ROADMAP 
 
    }); 
 

 
    //Region Overlay 
 
    var latLng1; 
 
    var latLng2; 
 

 
    <?php foreach ($this->arrRegion as $region) { ?> 
 
     latLng1 = new google.maps.LatLng(<?php echo $region['boundLat1_region']; ?>,<?php echo $region['boundLng1_region']; ?>); 
 
     latLng2 = new google.maps.LatLng(<?php echo $region['boundLat2_region']; ?>,<?php echo $region['boundLng2_region']; ?>); 
 
     redraw(latLng1,latLng2); 
 
    <?php }?> 
 

 
    } 
 

 
    /** 
 
    * Updates the Rectangle's bounds to resize its dimensions. 
 
    */ 
 
    function redraw(latLng1,latLng2) { 
 
    var latLngBounds = new google.maps.LatLngBounds(latLng1,latLng2); 
 
    
 
    // Remove Previous Rectangle 
 
    if(rectangle) 
 
     rectangle.setMap(null); 
 
    
 
    // Create a new Rectangle overlay 
 
    rectangle = new google.maps.Rectangle({map: map, bounds: latLngBounds}); 
 
    } 
 

 
    // Register an event listener to fire when the page finishes loading. 
 
    google.maps.event.addDomListener(window, 'load', init);