2009-05-06 11 views
5

Google Maps/Javascriptに関するいくつかの問題があります。私は問題が何であるかを知っていると思うが、それだけの方法を知らない。Googleマップ問題:閉じると参照渡し

私の問題の例はhereです。どのマーカーをクリックしても、2番目のマーカーが表示されます。私は間違った情報を明らかにイベントリスナーに渡していますが、コードを正しく取得できないようです。ここでは、コードのカットダウン一部です:

まず、ここに私のコードの一部です:

if (GBrowserIsCompatible() && mapResults != null) { 
    // Read in the JSON 
    var mapDetailsArray = loadJSON(); 

    // Create a map 
    var map = new google.maps.Map2(document.getElementById(elementId)); 
    map.setCenter(new google.maps.LatLng(mapDetailsArray[0].getLatitude(), 
     mapDetailsArray[0].getLongitude()), 13); 
    map.addControl(new google.maps.SmallMapControl()); 

    // Add the points and center 
    var mgr = new google.maps.MarkerManager(map); 
    var bounds = new google.maps.LatLngBounds(); 
    for (var i = 0; i < mapDetailsArray.length; i++) { 
    var mapDetails = mapDetailsArray[i]; 

    var point = new google.maps.LatLng(mapDetails.getLatitude(), mapDetails 
     .getLongitude()); 
    bounds.extend(point); 

    // Create our marker 
    var marker = new google.maps.Marker(point); 

    // What action do we use to show the hover 
    var infoAction = "mouseover"; 

    marker.value = mapDetails; 

    google.maps.Event.addListener(marker, infoAction, function() { 
     alert(marker.value); 
     map.openInfoWindowHtml(point, getResultInfoContent(marker.value)); 
    }); 

    mgr.addMarker(marker, 1); 
    } 
    mgr.refresh(); 
} 

「marker.value」常にmapDetailsが何であったかの最後の値としてセットを終わります。何かがあれば、ループが終了したらその値は "未定義"になると思いますが、その値はとにかく消えてはいけませんか?さまざまな値を試しました(たとえば、marker.value = i + 1;)が、どちらの点でも同じ値として表示されます。

イベントリスナーに正しい値をどのように渡すことができますか?これに

google.maps.Event.addListener(marker, infoAction, function() { 
     alert(marker.value); 
     map.openInfoWindowHtml(point, getResultInfoContent(marker.value)); 
    }); 

google.maps.Event.addListener(marker, infoAction, (function(marker, point, map) { return function() { 
     alert(marker.value); 
     map.openInfoWindowHtml(point, getResultInfoContent(marker.value)); 
    }})(marker, point, map)); 

これは、あなたが望むクロージャを作成します。この

答えて

6

変更。明瞭さのために分割

var f = function(marker, point, map) 
{ 
    return function() 
    { 
     alert(marker.value); 
     map.openInfoWindowHtml(point, getResultInfoContent(marker.value)); 
    } 
} 

google.maps.Event.addListener(marker, infoAction, f(marker, point, map)); 
+0

。乾杯グレッグ。私は以前のようなものを試していましたが、return関数(){...}はコードをラッピングしませんでした。 –

+0

私は同じ問題を経験し、同じ修正を使用しました。私はこれがJavascriptのバグだと本当に感じています。 – SingleNegationElimination

+0

私はそれがバグだとは思わない、それはあまり直感的ではない – Greg

3

上記の答えは、しかし非常に直感的ではありません - グレッグが言ったように。

イベントをオブジェクトに追加すると、そのオブジェクトはパスされ、クロージャ内の「this」でアクセスできます。 "marker.value"を "this.value"に置き換えた場合、問題は解決されています。あなたがより多くのものを伝承する必要がある場合は、オブジェクトにそれを結ぶ、それを伝承:

marker.a = 1 
marker.b = 2 
marker.c = 3 

を1というようになりますthis.aクロージャ内..トリックをした