2010-08-27 216 views
2

我正在嘗試使用Google地圖作爲背景,並使用固定覆蓋圖。 Have a look-see預加載谷歌地圖覆蓋圖

您可以看到問題 - ,而正在加載,文本不可讀。覆蓋圖由Google的JS加載。如何隱藏地圖,直到覆蓋圖已經加載? (或更好的解決方案?)

回答

4

其實,你可以使用JavaScript來確保地圖只顯示在覆蓋加載:

document.observe('dom:loaded', function() 
{ 
    if (GBrowserIsCompatible()) { 
    var overlaySrc = 'img/contact_map_overlay.png'; 
    var preloadOverlay = new Image(); 

    preloadOverlay.onload = function() { 
     var map = new GMap2(document.getElementById("map_canvas")); 
     map.setCenter(new GLatLng(-33.82568, 151.2180955505371), 14, G_PHYSICAL_MAP); 
     var mapTypeControl = new GMapTypeControl(); 
     var topRight = new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(80, 250)); 
     map.addControl(new GSmallMapControl(), topRight); 
     var mapTarget = new GScreenOverlay(overlaySrc, new GScreenPoint(0.0, 0.0, 'fraction', 'fraction'), // screenXY 
     new GScreenPoint(0, 0),                        // overlayXY 
     new GScreenSize(1, 1, 'fraction', 'fraction')                   // size on screen 
    ); 
     map.addOverlay(mapTarget); 

     var pin = new GIcon(G_DEFAULT_ICON); 
     pin.image = "img/pin.png"; 
     pin.shadow = "no-shadow"; 
     pin.iconSize = new GSize(34, 43); 
     markerOptions = { 
     icon: pin 
     }; 

     var marker = new GMarker(new GLatLng(-33.82568, 151.240635), markerOptions); 
     map.addOverlay(marker); 
    } 

    preloadOverlay.src = overlaySrc; 
    } 
}); 

谷歌只顯示來自服務器的形象,所以其顯示在地圖之前加載到緩存中將解決你的問題。

+0

甜。謝啦。 – 2010-08-31 13:01:54

0

我沒有看到任何方式在v2 Api要麼知道覆蓋何時加載,要麼隱藏地圖,直到它完成覆蓋。

load()事件在疊加完成加載之前觸發。我注意到這個覆蓋層在684KB處非常大。較小的覆蓋加載更快。

您可能還會考慮將背景圖片或背景圖片放在聯繫我們正在遮蓋的文本之後(僅授予5秒鐘)。