爲什麼谷歌地圖標記不在Chrome，Safari和Internet Explorer上顯示Firefox

Question

我在這個頁面上有一些奇怪的問題：http://www.bluprintliving.com/locations似乎我想要顯示的標記顯示在Firefox中但未顯示Chrome/Safari或IE。我不確定從哪裏開始調試此問題，因爲沒有javascript錯誤。

該代碼分爲兩部分。第一個js文件http://www.bluprintliving.com/js/local-area-gmaps.js

var localSearch = new GlocalSearch(); 
var global_point; 

var icon = new GIcon(); 
icon.image = "http://www.google.com/mapfiles/marker.png"; 
icon.shadow = "http://www.google.com/mapfiles/shadow50.png"; 
icon.iconSize = new GSize(20, 34); 
icon.shadowSize = new GSize(37, 34); 
icon.iconAnchor = new GPoint(10, 34);  

function usePointFromPostcode(postcode, callbackFunction) { 
localSearch.setSearchCompleteCallback(null, 
    function() { 

    if (localSearch.results[0]) 
    { 
    var resultLat = localSearch.results[0].lat; 
    var resultLng = localSearch.results[0].lng; 
    var point = new GLatLng(resultLat,resultLng); 
    callbackFunction(point); 
    global_point = point; 
    }else{ 
    alert("Postcode not found!"); 
    } 
    }); 

localSearch.execute(postcode + ", UK"); 
} 

function setCenterToPointLondon(point) { 
//map.setCenter(point, 15); 
map.setCenter(new GLatLng(51.50788772102843,-0.1050567626953125), 11); 
var marker = new GMarker(point,icon); 
map.addOverlay(marker); 
}  

function setCenterToPoint(point) { 
map.setCenter(point, 15); 
var marker = new GMarker(point,icon); 
map.addOverlay(marker); 
} 

function createMarker(point,html) { 
var marker = new GMarker(point); 
GEvent.addListener(marker, "click", function() { 
    marker.openInfoWindowHtml(html); 
}); 
return marker; 
} 

然後在頁面上的每個地圖有是它的一個部分，它看起來像：

第一張地圖

<div id="map" class="location-map"></div>  
<script type="text/javascript"> 
//<![CDATA[ 
var map = new GMap2(document.getElementById("map")); 
map.addControl(new GLargeMapControl()); 
map.addControl(new GMapTypeControl()); 
map.setCenter(new GLatLng(51.50788772102843,-0.1050567626953125), 11); 
usePointFromPostcode("WC1N 2PL", setCenterToPointLondon); 
usePointFromPostcode("EC1M 5RR", setCenterToPointLondon); 
//]]> 
</script> 

第二張地圖

<div id="map-no-5-doughty-street" class="location-map"></div>  
<script type="text/javascript"> 
//<![CDATA[ 
var map = new GMap2(document.getElementById("map-no-5-doughty-street")); 
map.addControl(new GLargeMapControl()); 
map.addControl(new GMapTypeControl()); 
map.setCenter(new GLatLng(51.50788772102843,-0.1050567626953125), 11); 
usePointFromPostcode("WC1N2PL", setCenterToPoint); 
//]]> 
</script> 

第三張地圖*

<div id="map-turnmill-street" class="location-map"></div>  
<script type="text/javascript"> 
//<![CDATA[ 
var map = new GMap2(document.getElementById("map-turnmill-street")); 
map.addControl(new GLargeMapControl()); 
map.addControl(new GMapTypeControl()); 
map.setCenter(new GLatLng(51.50788772102843,-0.1050567626953125), 11); 
usePointFromPostcode("EC1M5RR", setCenterToPoint); 
//]]> 
</script> 

現在，這些都是動態生成這樣一個頁面有可能增長到地圖的位置生長。

這一切都按照預期在Firefox中運行，但不是其他瀏覽器。標記不顯示，並且看起來中心也在其他瀏覽器中關閉。

幫助！請！ :)

在此先感謝

UPDATE

我已經把所有的代碼在一個頁面上，所以很容易看出問題和調試：http://www.bluprintliving.com/google-maps.php

再次感謝

Answer 1

最後通過重寫函數來解決它。主要的JS文件現在讀：

var icon = new GIcon(); 
icon.image = "http://www.google.com/mapfiles/marker.png"; 
icon.shadow = "http://www.google.com/mapfiles/shadow50.png"; 
icon.iconSize = new GSize(20, 34); 
icon.shadowSize = new GSize(37, 34); 
icon.iconAnchor = new GPoint(10, 34);  

var mapCollection = {}; 

function addLocation(location, map, zoom) { 
    var localSearch = new GlocalSearch(); 

    localSearch.setSearchCompleteCallback(null, 
      function() { 

       if (localSearch.results[0]) 
       {  
        var resultLat = localSearch.results[0].lat; 
        var resultLng = localSearch.results[0].lng; 
        var point = new GLatLng(resultLat,resultLng); 
        mapCollection[map].setCenter(point, zoom); 
        var marker = new GMarker(point, icon); 
        mapCollection[map].addOverlay(marker); 
       }else{ 
        alert("Postcode not found!"); 
       } 
      }); 

     localSearch.execute(location + ", UK"); 

} 

要添加新的地圖只是這樣做：

<div id="map" class="location-map"></div>      
<script type="text/javascript"> 
//<![CDATA[ 
    mapCollection["map"] = new GMap2(document.getElementById("map")); 
    mapCollection["map"].addControl(new GLargeMapControl()); 
    mapCollection["map"].addControl(new GMapTypeControl()); 
    mapCollection["map"].setCenter(new GLatLng(51.50788772102843,-0.1050567626953125), 11);       
    addLocation("WC1N 2PL", "map", "11"); 
    addLocation("EC1M 5RR", "map", "11"); 
//]]> 
</script> 

映射碼X *

<div id="map-turnmill-street" class="location-map"></div>      
<script type="text/javascript"> 
//<![CDATA[ 
    mapCollection["map-turnmill-street"] = new GMap2(document.getElementById("map-turnmill-street")); 
    mapCollection["map-turnmill-street"] .addControl(new GLargeMapControl()); 
    mapCollection["map-turnmill-street"] .addControl(new GMapTypeControl()); 
    mapCollection["map-turnmill-street"] .setCenter(new GLatLng(51.50788772102843,-0.1050567626953125), 11); 
    addLocation("EC1M5RR", "map-turnmill-street", 15); 
//]]> 
</script> 

現在，這將爲您提供能夠在頁面上添加多個地圖，每個地圖都有您想要的標記，方法是添加更多的「addLocation」調用，它將字符串位置，地圖持有者名稱和縮放級別作爲i nputs。