Seadragon에 하나 이상의 오버레이를 생성 할 수 없습니다.

Question

나는 오버 헤드를 추가하려고합니다. 그러나 어떤 이유로 인해 우리의 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); 

Answer 1

나는 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) } 
];