OpenSeadragon - невозможно открыть / невозможно загрузить tileSource - PullRequest
0 голосов
/ 18 февраля 2020

Я пытаюсь отобразить изображения IIIF из манифестов с openseadragon. Я получаю следующую ошибку: «Невозможно открыть [объект Object]: невозможно загрузить TileSource».

Я прекрасно вижу этот кодовый элемент , поэтому вопрос заключается в том, как использовать внешний манифест, такой как этот:
https://luna.manchester.ac.uk/luna/servlet/iiif/m/ManchesterDev~93~3~24479~100399/manifest

Это кажется чем-то очевидным, но я не могу найти, как отобразить изображение. Любая помощь приветствуется!

Вот минимальный рабочий пример:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <title>IIIF Viewer</title>
        <script src="https://code.jquery.com/jquery-3.4.1.min.js"
            integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
            crossorigin="anonymous"></script>
        <script type="text/javascript" src="https://openseadragon.github.io/openseadragon/openseadragon.min.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
          // ********************
          // openseadragon viewer
          //
          // ********************
          var manifest_link = $("#manifest").text();

          console.log(manifest_link);

          var viewer = OpenSeadragon({
            id: "openseadragon",
            prefixUrl: "//openseadragon.github.io/openseadragon/images/",
            preserveViewport: true,
            visibilityRatio: 1,
            minZoomLevel: 1,
            defaultZoomLevel: 1,
            sequenceMode: true,
            tileSources: [manifest_link]
          });
        });
        </script>
    </head>
    <body id="body">
        <h1>TESTING IIIF VIEWER</h1>
        <div id="viewer">
            <div id="manifest">
                https://luna.manchester.ac.uk/luna/servlet/iiif/m/ManchesterDev~93~3~24479~100399/manifest
            </div>
            <div id="openseadragon" style="width:800px; height:600px;"></div>
        </div>
    </body>

</html>
...