为什么谷歌地图标记不在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。