Openseadragon 简单图像

Question

我正在尝试使用exist-db 和openseadragon 构建一些东西：

我的文件结构可以在链接中找到。 click here 在里面，我有相应的文件。 现在，我想在 show.html 中使用带有 openseadragon 的简单图像（位于页面中。因为我所有的 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：“图像”， 网址：“/data/images/Page0001.JPG” });

    </div>

This 是我得到的。带有导航切换的空 openseadragon-div。

我首先以为我弄乱了 URL，并在其中添加了“../”（或任何其他位置），但无济于事。 谁能指出我正确的方向？

在显示 Page0001.JPG 后，我将从我拥有的 18 张图片中制作一个序列（并将 openseadragon-viewer 同步到包含随附文本的 div）

这只是第一步，我想我以后会去 DZI。但是，我现在只有蹩脚的照片，我必须拍更好的照片，所以为什么不在我添加最终照片之前做出一个“概念”（+我想学习一些东西！）

提前致谢！

Answer 1

您需要将图像规范放入您的tileSources 属性中，如下所示：

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