谷歌地圖api多邊形選擇邊緣

我開始使用谷歌地圖api v3，我正在尋找一種方法能夠選擇我添加到地圖中的多邊形邊緣並更改它的顏色。文檔似乎不是幫助。谷歌地圖api多邊形選擇邊緣

我試圖尋找一個jquery插件或圖形框架，但沒有運氣。

這裏是我的代碼

var drawingManager; 

function initialize() { 
    var mapOptions = { 
     center: new google.maps.LatLng(46.71109, 1.7191036), 
     zoom: 6 
    }; 

    var mapOptions2 = { 
     center: new google.maps.LatLng(46.71109, 1.7191036), 
     zoom: 6, 
     mapTypeId: google.maps.MapTypeId.SATELLITE, 
     tilt: 0, 
    }; 
    var map = new google.maps.Map(document.getElementById("map-canvas"), 
     mapOptions); 

    var map2 = new google.maps.Map(document.getElementById("map-canvas2"), 
     mapOptions2); 

     drawingManager = new google.maps.drawing.DrawingManager({ 
      drawingControl: true, 
      polygonOptions: { 
       strokeColor: '#AA2143', 
       strokeWeight: 3, 
       fillColor: '#0099FF', 
       fillOpacity: 0.2, 
       editable: true 
      }, 
     drawingControlOptions: { 
      drawingModes: [ 
       google.maps.drawing.OverlayType.POLYGON 
      ] 

     } 
    }); 

    drawingManager.setMap(map2); 

    var input = (document.getElementById('searchAddress')); 
    var autocomplete = new google.maps.places.Autocomplete(input); 
    autocomplete.bindTo('bounds', map); 
    var infowindow = new google.maps.InfoWindow(); 
    var marker = new google.maps.Marker({ 
     map: map, 
     anchorPoint: new google.maps.Point(0, -29) 
    }); 

    google.maps.event.addListener(autocomplete,'place_changed',function() 
    { 
     infowindow.close(); 
     marker.setVisible(false); 
     var place = autocomplete.getPlace(); 
     if (!place.geometry) { 
      return; 
     } 

     if (place.geometry.viewport) { 
      map.fitBounds(place.geometry.viewport); 
      map2.fitBounds(place.geometry.viewport); 

     } else { 
      map.setCenter(place.geometry.location); 

      map2.setCenter(new google.maps.LatLng(place.geometry.location.lat() + 0.0015, place.geometry.location.lng() - 0.0015)); 

      map.setZoom(17); 
      map2.setZoom(18); 
     } 

     marker.setIcon(({ 
      url: place.icon, 
      size: new google.maps.Size(71, 71), 
      origin: new google.maps.Point(0, 0), 
      anchor: new google.maps.Point(17, 34), 
      scaledSize: new google.maps.Size(35,35) 
     })); 
     marker.setPosition(place.geometry.location); 
     marker.setVisible(true); 

     var address = ''; 
     if (place.address_components) { 
      address = [ 
       (place.address_components[0] && place.address_components[0].short_name || ''), 
       (place.address_components[1] && place.address_components[1].short_name || ''), 
       (place.address_components[2] && place.address_components[2].short_name || '') 
      ].join(' '); 
     } 

     infowindow.setContent('<div><strong>' + place.name + '</strong><br>' + address); 
     infowindow.open(map, marker); 
    }); 

} 

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

$(document).ready(function() { 
    $('.buttonDrawContourPrincipal').click(function() { 
     drawingManager.setDrawingMode(google.maps.drawing.OverlayType.POLYGON); 

    }); 


});

來源

2014-03-28 Helmi

的documentation應該有所幫助。

A Polygon有一個setOptions方法和一個strokeColor屬性。

編輯

現在我們知道你正在嘗試做的，你可以試試這個方法：當您繪製多邊形，還繪製多邊形上述折線和檢測僅在折線的單擊事件。

來源

2014-03-28 10:02:35 MrUpsidown

感謝您的回覆，我還沒有代碼。我仍然在尋找一種方法來選擇整個多邊形的邊緣。 setoptions只會改變多邊形的屬性，而strokeColor會改變所有的邊緣顏色。 – Helmi

請定義*選擇邊*。 – MrUpsidown

好的，所以基本上，我已經實現了繪製多邊形的代碼，之後，我只想選擇一個邊或面，然後更改該面的顏色。 – Helmi

谷歌地圖api多邊形選擇邊緣

回答

相關問題