Openseadragon простое изображение

Question

Я пытаюсь что-то построить, используя существующие-db и openseadragon:

Моя файловая структура может быть найдена в ссылке. нажмите здесь внутри, у меня есть соответствующие файлы. Сейчас я хочу использовать простые изображения с openseadragon в show.html (расположенном на страницах. Все мои html-файлы хранятся в этой папке).

мой show.html выглядит так:

<div class="content-container">
<div class="column">blablabla</div>
<div class="column" id="dragon-container">
<div id="seadragon-viewer" style="height:600px; width:100%; position:right;"/>
</div>

var viewer = OpenSeadragon ({id: "seadragon-viewer", tpye: "image", url: "/data/images/Page0001.JPG"});

    </div>

Это то, что я получаю. Пустой openseadragon-div с переключателем навигации.

Сначала я подумал, что перепутал URL и добавил к нему "../" (или любое другое место), но безрезультатно. Может кто-то указать мне верное направление?

После того, как я покажу Page0001.JPG, я сделаю последовательность из 18 имеющихся у меня изображений (и синхронизирую openseadragon-viewer с элементами div, содержащими сопровождающий текст)

Это всего лишь первый шаг, я думаю, что я пойду на DZIs потом. Тем не менее, у меня пока только дрянные фотографии, и мне придется делать лучшие, так почему бы не сделать "концепцию", прежде чем я добавлю окончательные фотографии (+ я хочу кое-что узнать!)

заранее спасибо!

Answer 1

Вы должны поместить спецификацию изображения в свой tileSources Свойство, вот так:

var viewer = OpenSeadragon({ 
  id: "seadragon-viewer", 
  tileSources: {
    type: "image", 
    url: "/data/images/Page0001.JPG" 
  }
});