在浏览器中显示多页tiff格式

I'd like to know if there is any way so that I can display a multi-paged tif image in browser using client-side coding (not server-side) in a way that user can navigate between the pages like common jquery photo libraries. I found Tiff.js from https://github.com/seikichi/tiff.js, but this library only gives download link of multi-paged tiff and do not display it in html.

我想知道是否有什么方法可以让我用客户端编码(而不是服务器端)在浏览器中显示一个多页的tif图像，用户可以在页面之间导航，比如普通的jquery照片库。我发现Tiff。js来自https://github.com/seikichi/tiff.js，但是这个库仅提供了多页tiff的下载链接，并且没有在html中显示。

I can do it in server-side using libraries like ImageMagic, LibTiff.Net etc but don't want to because the number of photos are huge and if I do that it consume the large amount of server's cpu

我可以在服务器端使用像ImageMagic, LibTiff这样的库。但我不想，因为照片的数量很大，如果我这么做的话，它会消耗大量服务器的cpu

do you know any alternative solution??

你知道其他的解决办法吗?

2 个解决方案

#1

I had this problem too and converting the images was not an option for us.

我也有这个问题，转换图像不是我们的选择。

You can use tiff.js that you linked to, have a look at the demo and then view source at http://seikichi.github.io/tiff.js/multipage.html.

您可以使用tiff。链接到的js，先看一下演示，然后在http://seikichi.github.io/tiff.js/multipage.html上查看源代码。

$(function () {
  Tiff.initialize({TOTAL_MEMORY: 16777216 * 10});
  var xhr = new XMLHttpRequest();
  xhr.open('GET', 'images/multipage.tiff');
  xhr.responseType = 'arraybuffer';
  xhr.onload = function (e) {
    var buffer = xhr.response;
    var tiff = new Tiff({buffer: buffer});
    for (var i = 0, len = tiff.countDirectory(); i < len; ++i) {
      tiff.setDirectory(i);
      var canvas = tiff.toCanvas();
      $('body').append(canvas);
    }
  };
  xhr.send();
});

Replace 'images/multipage.tiff' with the path to your file and it will add each page to the body element (just replace $('body') with your element if you want it somewhere else). Works with single tiff as well.

取代“图像/多页。使用文件路径tiff'，它会将每个页面添加到body元素(如果您希望在其他地方添加元素，只需将$('body')替换为元素)。也可以使用单一tiff格式。

#2

Browsers won't support tif images. check this Wiki Link. You have to generate a png image and store it and show that in browser for the tif.

浏览器不支持tif图像。检查这个Wiki链接。您必须生成一个png图像并将其存储并在浏览器中显示给tif。

#1