GoogleマップがFirefoxに集中していない

Question

Googleマップで奇妙な問題が発生しました。私はFirefoxでしか複製できません。説明すると、静的な地図があります。この地図をクリックすると、中央のマーカーと相互作用可能な完全な地図に拡大表示されます。 Firefoxを除くすべてのブラウザで正常に動作します。 Firefoxでは、マップが正しく中央揃えされていません。マーカーは配置されますが、可視領域のすぐ外側のマップの左上隅にあります。

アイデア？これはしばらく私を困惑させている。

はJavaScript：

// lat and lng are initialized earlier 
var latlng = new google.maps.LatLng(lat, lng); 
var myOptions = { 
    zoom: 13, 
    center: latlng, 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
}; 

var map = new google.maps.Map($("#map_canvas")[0], myOptions); 

var marker = new google.maps.Marker({ 
    position: latlng, 
    map: map, 
    icon: icon 
}); 

var resizeMap = function() { 
    $("#smallMap, #smallMapOverlay").remove(); 
    $("#map_canvas").show(); 
    google.maps.event.trigger(map, 'resize'); 
    map.setCenter(latlng, 13); 
}; 

$("#smallMapOverlay").live("click", function (e) { 
    e.preventDefault(); 
    resizeMap(); 
}); 

CSS：

#map_canvas { 
    width: 640px; 
    height: 377px; 
} 

Answer 1

show()のコールバックにresizeとsetCenter方法を入れているようだ、と小さな遅延を与えることは問題が修正されます。

var resizeMap = function() { 
    $("#smallMap, #smallMapOverlay").remove(); 
    $("#map_canvas").show(10, function() { 
     google.maps.event.trigger(map, 'resize'); 
     map.setCenter(latlng, 13); 
    }); 
}; 

これは最も洗練された解決策ではありませんが、機能します。

Answer 2

Karim79 '修正が動作します。私は少し違った方法でそれを働かせました。あなたはマッピング機能を処理するためのラッパークラスを使用している場合、あなたは、そのようなリセット機能を作成することができ

function reset(){ 
     setTimeout(function(){gm.event.trigger(_gMap, 'resize');}, 50); 
     setTimeout(function(){_gMap.setCenter(settings.mapOptions.center);}, 100); 
    } 

ベスト