2010-11-29 5 views
0

J'ai créé une superposition Google Maps, mais pour une raison quelconque, le curseur de zoom en haut à gauche de la carte a cessé de fonctionner. J'ai essayé de séparer le code pour le réparer, mais je n'arrive pas à trouver ce qui est cassé. Quelqu'un peut-il jeter un coup d'oeil pour voir ce qui me manque?Google maps zoom broken

http://www.ucl.ac.uk/study/virtualtours/

Mon code est ici:

<script type="text/javascript"> 

google.load("maps", "2"); 
google.load("jquery", "1.4.2"); 

var map; 
var camera; 
var side_bar_html = ""; 
var gmarkers = []; 

function TileToQuadKey (tx, ty, zl){ 
    var quad = ""; 
    for (var i = zl; i > 0; i--) { 
    var mask = 1 << (i - 1); 
    var cell = 0; 
    if ((tx & mask) != 0) cell++; 
if ((ty & mask) != 0) cell += 2; 
quad += cell; 
    } 
    return quad; 
} 

var uclvtTiles = function (a,b) {    
    var f = "http://www.ucl.ac.uk/prosp-students/access/virtual-tour/tourlayers/" + TileToQuadKey(a.x,a.y,b) + ".png"; 
    return f; 
} 

function createUclVTSatMapType() { 
    var uclvtHybridLayer = new Array(); 
    uclvtHybridLayer[0] = G_NORMAL_MAP.getTileLayers()[0]; 
    uclvtHybridLayer[1] = new GTileLayer(new GCopyrightCollection('') , 17, 17); 
    uclvtHybridLayer[1].getTileUrl = uclvtTiles; 
    uclvtHybridLayer[1].getCopyright = function(a,b) {return "University College London, 2010";}; 
    uclvtHybridLayer[1].getOpacity = function() {return 0.97;};//opacity of the non transparent part 
    if(navigator.userAgent.indexOf("MSIE") == -1) { 
    uclvtHybridLayer[1].isPng = function() {return true;}; 
    } 

    var uclvtSatMap = new GMapType(
     uclvtHybridLayer, 
     G_NORMAL_MAP.getProjection(), 
     'UCL Map', 
     {errorMessage:"", alt:"Show imagery with UCL Map"}); 

    uclvtSatMap.getTextColor = function() {return "#000000";}; 
    return uclvtSatMap; 
} 

function myclick(i) { 
    GEvent.trigger(gmarkers[i], 'click'); 
} 

function addMarker(point, title, video, details) { 
    var marker = new GMarker(point, {title: title, icon:camera}); 
    GEvent.addListener(marker, "click", function() { 
    if (details) { 
     marker.openInfoWindowTabsHtml([new GInfoWindowTab("Video", video), 
            new GInfoWindowTab("More", details)]); 
    } else { 
     marker.openInfoWindowHtml(video); 
    } 
    }); 

    var id = gmarkers.length; 
    gmarkers.push(marker); 
    map.addOverlay(marker); 

    return id; 
} 

function flashMovieHTML(title, file) { 
    return '<div style="width:335px; height:260px">' + 
      '<b>' + title + '</b>' + 
      '<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="325" height="244" ' + 
        'id="' + title + '" ' + 
        'title="' + title + '">' + 
       '<param name="movie"  value="http://www.ucl.ac.uk/prosp-students/access/virtual-tour/' + file + '" />' + 
       '<param name="quality" value="high" />' + 
       '<param name="wmode"  value="opaque" />' + 
       '<param name="swfversion" value="8.0.35.0" />' + 
       '<embed src="http://www.ucl.ac.uk/prosp-students/access/virtual-tour/' + file + '" ' + 
        'quality="high" ' + 
        'width="325" ' + 
        'height="244" ' + 
        'name="' + title + '" ' + 
        'type="application/x-shockwave-flash" ' + 
        'pluginspage="http://www.macromedia.com/go/getflashplayer">' + 
       '</embed>' + 
      '</object>' + 
     '</div>'; 
} 

function addMarkersToMap() { 
    GDownloadUrl('campus.xml', function(doc) { 
    var xmlDoc = GXml.parse(doc); 
    var locations = xmlDoc.documentElement.getElementsByTagName("location"); 

    var currentCategory = ""; 
    for (var i = 0; i < locations.length; i++) { 
     var lat  = parseFloat(locations[i].getAttribute("lat")); 
     var lng  = parseFloat(locations[i].getAttribute("lng")); 
     var point = new GLatLng(lat,lng); 
     var title = locations[i].getAttribute("title"); 
     var menu  = locations[i].getAttribute("menu"); 
     var video = locations[i].getAttribute("video"); 
     var category = locations[i].getAttribute("category"); 
     var details = locations[i].childNodes.length == 0 ? null : 
        '<div style="width:335px; height:260px">' + 
         locations[i].childNodes[0].nodeValue + 
        '</div>'; 

     var id = addMarker(point, title, flashMovieHTML(title, video), details); 

     if (category != currentCategory) { 
     if (id > 0) { 
      side_bar_html += '</ul></div></div>'; 
     } 
     side_bar_html += '<div class="collapsable">'; 
     side_bar_html += '<h4 class="toggleCollapsableContent">' + category + '</h4>'; 
     side_bar_html += '<div class="collapsableContent"><ul>'; 
     } 
     side_bar_html += '<li><a href="javascript:myclick(' + id + ')">' + menu + '<\/a></li>'; 
     currentCategory = category; 
    } 
    side_bar_html += '</ul></div></div>'; 
    document.getElementById("right").innerHTML = side_bar_html; 

$ ("h4.toggleCollapsableContent: gt (0)") .addClass ('fermé') .next ('collapsableContent').cacher();

$("h4.toggleCollapsableContent").click(function() { 
     if ($(this).next($(".collapsableContent")).is(":hidden")) { 
     $(this).next($(".collapsableContent")).slideDown("fast"); 
     $(this).removeClass("closed"); 
     } else { 
     $(this).next($(".collapsableContent")).slideUp("fast"); 
     $(this).addClass("closed"); 
     } 
    }); 
    }); 
} 


function initialize() { 
    if (GBrowserIsCompatible()) { 
    map = new GMap2(document.getElementById("mapDiv")); 
    map.setCenter(new GLatLng(51.52484592590448, -0.13345599174499512), 17); 
    map.setUIToDefault(); 

    var uclvtSatMapType = createUclVTSatMapType() 
    map.addMapType(uclvtSatMapType); 
    map.setMapType(uclvtSatMapType); 

    camera = new GIcon(G_DEFAULT_ICON); 
    camera.image = "ucl-video.png"; 
    camera.iconSize   = new GSize(32,37); 
    camera.iconAnchor  = new GPoint(16,35); 
    camera.infoWindowAnchor = new GPoint(16,2); 
    addMarkersToMap(); 
    } 
} 

google.setOnLoadCallback(initialize); 

Cheers,

G

Répondre

1

Cela peut vous aider:

#map img{max-width: inherit;}