Карты Google - элементы управления исчезают в Firefox, но не в Internet Explorer 6 - PullRequest
0 голосов
/ 05 августа 2009

У меня есть ошибка Google Maps JavaScript, которую я не могу до конца понять. Код работает так, как вы видите карты на странице, но элементы управления кажутся «под» изображениями карт, вы видите их только при загрузке страницы и при быстром увеличении или уменьшении.

Извините, что просто выгрузил код, но, честно говоря, я не вижу, в чем проблема.

Я пробовал:

  1. удаление панорамы улицы
  2. удаление другого JavaScript на странице
  3. удаляя все это и извлекая код маркера, оставляя самые простые карты встроенными (с элементами управления)

В Firefox 3 и Chrome всегда выполняется одно и то же, но НЕ в Internet Explorer 6. По какой-то причине это работает нормально.

Очень странно.

<script type="text/javascript">
    <!--
    var $j = jQuery.noConflict();
    $j('#logo').supersleight();
    $j('#col2_2_overlay').supersleight();
    $j('#bookmark').supersleight();
    google.load("maps", "2.x");
    // Call this function when the page has been loaded
    function initcf() {
        var map = new GMap2(document.getElementById("map"));
        map.addControl(new GSmallMapControl());
        map.addControl(new GMapTypeControl());
        map.setCenter(new GLatLng(51.478804, -0.215886), 15);
        // Create our "tiny" marker icon
        var tinyIcon = new GIcon();
            tinyIcon.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";
            tinyIcon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
            tinyIcon.iconSize = new GSize(12, 20);
            tinyIcon.shadowSize = new GSize(22, 20);
            tinyIcon.iconAnchor = new GPoint(6, 20);
            tinyIcon.infoWindowAnchor = new GPoint(5, 1);
            // Set up our GMarkerOptions object
            markerOptions = { icon:tinyIcon };
        var point = new GLatLng(51.479018, -0.215178);
        map.addOverlay(new GMarker(point, markerOptions));
    }
    function initcf1() {
        var myPano = new GStreetviewPanorama(document.getElementById("banner"));
        contentformula = new GLatLng(51.479018, -0.215178);
        myPOV = {yaw:378.64659986187695, pitch:-7};
        myPano.setLocationAndPOV(contentformula, myPOV);
        GEvent.addListener(myPano, "error", handleNoFlash);
    }
    function handleNoFlash(errorCode) {
      if (errorCode == 603) {
        initcf_backup();
        return;
      }
    }
    function initcf_backup() {
        var map_a = new GMap2(document.getElementById("banner"));
        map_a.addControl(new GLargeMapControl());
        map_a.setMapType(G_SATELLITE_MAP);
        map_a.setUIToDefault();
        map_a.setCenter(new google.maps.LatLng(51.478804, -0.215886), 18);
        // Create our "tiny" marker icon
        var tinyIcon_a = new GIcon();
            tinyIcon_a.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";
            tinyIcon_a.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
            tinyIcon_a.iconSize = new GSize(12, 20);
            tinyIcon_a.shadowSize = new GSize(22, 20);
            tinyIcon_a.iconAnchor = new GPoint(6, 20);
            tinyIcon_a.infoWindowAnchor = new GPoint(5, 1);
            // Set up our GMarkerOptions object
            markerOptions_a = { icon:tinyIcon_a };
        var point_a = new GLatLng(51.479018, -0.215178);
        map_a.addOverlay(new GMarker(point_a, markerOptions_a));
    }
    google.setOnLoadCallback(initcf);
    google.setOnLoadCallback(initcf1);
    //-->
</script>

1 Ответ

1 голос
/ 05 августа 2009

Я попытался загрузить ваш код на страницу, и он, кажется, работал просто отлично. Я закомментировал функции сверхлегкости - они могут иметь к этому какое-то отношение. Если нет - проверьте, есть ли на странице какой-либо CSS-код, который может создавать помехи.

Вот моя страница:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Google Maps Test</title>
    <script type="text/javascript" src="http://www.google.com/jsapi?key=ABCDEFG"></script>
    <script type="text/javascript">
        <!--
        //var $j = jQuery.noConflict();
        //$j('#logo').supersleight();
        //$j('#col2_2_overlay').supersleight();
        //$j('#bookmark').supersleight();
        google.load("maps", "2.x");
        // Call this function when the page has been loaded
        function initcf() {
            var map = new GMap2(document.getElementById("map"));
            map.addControl(new GSmallMapControl());
            map.addControl(new GMapTypeControl());
            map.setCenter(new GLatLng(51.478804, -0.215886), 15);           
            // Create our "tiny" marker icon
            var tinyIcon = new GIcon();
                    tinyIcon.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";
                    tinyIcon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
                    tinyIcon.iconSize = new GSize(12, 20);
                    tinyIcon.shadowSize = new GSize(22, 20);
                    tinyIcon.iconAnchor = new GPoint(6, 20);
                    tinyIcon.infoWindowAnchor = new GPoint(5, 1);
                    // Set up our GMarkerOptions object
                    markerOptions = { icon:tinyIcon };
            var point = new GLatLng(51.479018, -0.215178);
            map.addOverlay(new GMarker(point, markerOptions));
        }
        function initcf1() {
            var myPano = new GStreetviewPanorama(document.getElementById("banner"));
            contentformula = new GLatLng(51.479018, -0.215178);
            myPOV = {yaw:378.64659986187695, pitch:-7};
            myPano.setLocationAndPOV(contentformula, myPOV);
            GEvent.addListener(myPano, "error", handleNoFlash);
        }
        function handleNoFlash(errorCode) {
          if (errorCode == 603) {
            initcf_backup();                
            return;
          }
        }
        function initcf_backup() {
            var map_a = new GMap2(document.getElementById("banner"));
            map_a.addControl(new GLargeMapControl());
            map_a.setMapType(G_SATELLITE_MAP);
            map_a.setUIToDefault();
            map_a.setCenter(new google.maps.LatLng(51.478804, -0.215886), 18);
            // Create our "tiny" marker icon
            var tinyIcon_a = new GIcon();
                    tinyIcon_a.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";
                    tinyIcon_a.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
                    tinyIcon_a.iconSize = new GSize(12, 20);
                    tinyIcon_a.shadowSize = new GSize(22, 20);
                    tinyIcon_a.iconAnchor = new GPoint(6, 20);
                    tinyIcon_a.infoWindowAnchor = new GPoint(5, 1);
                    // Set up our GMarkerOptions object
                    markerOptions_a = { icon:tinyIcon_a };
            var point_a = new GLatLng(51.479018, -0.215178);
            map_a.addOverlay(new GMarker(point_a, markerOptions_a));
        }   
        google.setOnLoadCallback(initcf);  
        google.setOnLoadCallback(initcf1);
        //-->         
    </script>
</head>
<body>
    <div id="map" style="width: 500px; height: 300px"></div>
    <div id="banner" style="width: 500px; height: 300px"></div>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...