2011-09-16 1 views
4

私はGoogle API V3を使用しています。このオーバレイにマウスオーバーで色が変わるグラウンドオーバーレイとポリゴンが必要です。グラウンドオーバーレイが定義されていない限り、mouseoverイベントは正常に動作します。しかし、地上のオーバーレイが存在する場合、マウスオーバーで色は変化しません。Google API V3:groundOverlayも定義されている場合のポリゴンマウスオーバーイベントの問題

提案がありますか?ここで

は一例です:

var newark = new google.maps.LatLng(40.740, -74.18); 
var imageBounds = new google.maps.LatLngBounds(
new google.maps.LatLng(40.716216,-74.213393), 
new google.maps.LatLng(40.765641,-74.139235)); 

var myOptions = { 
zoom: 13, 
center: newark, 
mapTypeId: google.maps.MapTypeId.ROADMAP 
} 

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

var oldmap = new google.maps.GroundOverlay(
"http://www.lib.utexas.edu/maps/historical/newark_nj_1922.jpg", 
imageBounds); 
oldmap.setMap(map); 

//Points to create polygon 
var points = [ 
new google.maps.LatLng(40.735657,-74.172367), 
new google.maps.LatLng(40.743588,-74.179498), 
new google.maps.LatLng(40.732878,-74.182777) 
] 
//Create Polygon 
var poly = new google.maps.Polygon({ 
    path: points, 
    map: map, 
    strokeColor: '#ff0000', 
    strokeOpacity: 1, 
    strokeWeight: 1, 
    fillColor: '#ff0000', 
    fillOpacity: 1 
}); 

//poly changes color on mouseover 
google.maps.event.addListener(poly, 'mouseover', function() { 
    poly.setOptions({ 
     strokeColor: '#0000ff', 
     fillColor: '#0000ff' 
    }); 
}); 

//poly changes color back on mouseout 
google.maps.event.addListener(poly, 'mouseout', function() { 
    poly.setOptions({ 
     strokeColor: '#ff0000', 
     fillColor: '#ff0000' 
    }); 
}); 

答えて

1

多分あなたはグラウンドオーバーレイが上に座って何マップ層の上に多くの制御を持っているように、背景のカスタムオーバーレイを作成する必要があります。

http://code.google.com/apis/maps/documentation/javascript/overlays.html#CustomOverlays

これは私があなたのコードを試していないとして、必ずしも問題ではありませんが、良い戦術は、形状があなたができるものがあるかどうかを確認するためにマークアップされているかを確認するためにFirebugののHTMLインスペクタを使用することです優先順位を変更するには、CSS/javascriptを使用します。

関連する問題