2010-06-01 23 views
1

我正在尝试为我正在创建的seadragon图添加覆盖图,但出于某种原因,我无法确定我们的seadragon忽略除第一个覆盖图以外的所有覆盖图。任何帮助,这是非常感谢。无法在Seadragon中创建多个覆盖图

var viewer = null; 

function init() { 
    Seadragon.Config.autoHideControls = false; 

    viewer = new Seadragon.Viewer("container"); 

    viewer.addEventListener("open", addOverlays); 

    viewer.addControl(makeControl(), Seadragon.ControlAnchor.TOP_RIGHT); 

    $(viewer.getNavControl()).parent().parent().css({ 'top': 10, 'right': 10 }); 
    viewer.openDzi("_assets/Mapdata/dzc_output.xml"); 

} 

function makeControl() { 
    var control = document.createElement("a"); 
    var controlText = document.createTextNode(""); 

    control.href = "#"; // so browser shows it as link 
    control.className = "control"; 
    control.appendChild(controlText); 

    Seadragon.Utils.addEvent(control, "click", 
        onControlClick); 

    return control; 
} 

function onControlClick(event) { 
    Seadragon.Utils.cancelEvent(event); // don't process link 

    if (!viewer.isOpen()) { 
     return; 
    } 

    // These are the coordinates of europe on this map 
    var x = 0.5398693914203284; 
    var y = 0.21155952391206562; 
    var z = 5; 

    viewer.viewport.panTo(new Seadragon.Point(x, y)); 
    viewer.viewport.zoomTo(z); 
    viewer.viewport.ensureVisible(); 
} 

function addOverlays(viewer) { 
    drawer = viewer.drawer; 
    var img = document.createElement("img"); 
    img.src = "_assets/Images/pushpin.png"; 

    $(img).addClass('pushPin'); 

    var overlays = [ 
     { elmt: img, point: new Seadragon.Point(0.51, 0.22) }, 
     { elmt: img, point: new Seadragon.Point(0.20, 0.13) } 
    ]; 

    for (var i = 0; i < overlays.length; i++) { 
     drawer.addOverlay(overlays[i].elmt, overlays[i].point); 
    } 


} 

Seadragon.Utils.addEvent(window, "load", init); 
+0

如果长码是恼人的阅读功能。我说的问题只是关于函数addOverlays(viewer)中的代码。 – XGreen 2010-06-02 10:29:53

回答

0

我应该已经创建了返回IMG并调用该对象数组内

function newpushPin() { 
    var img = document.createElement("img"); 
    img.src = "_assets/Images/pushpin.png"; 
    return img 
} 

var overlays = [ 
    { elmt: newpushPin(), point: new Seadragon.Point(0.51, 0.22) }, 
    { elmt: newpushPin(), point: new Seadragon.Point(0.53, 0.22) }, 
    { elmt: newpushPin(), point: new Seadragon.Point(0.53, 0.23) }, 
    { elmt: newpushPin(), point: new Seadragon.Point(0.50, 0.20) } 
]; 
+0

是的,因为每个叠加层都是一个独特的html dom节点,它具有不同的id – jujule 2010-10-13 19:43:09