0

I'm using openseadragon to display deep zoom images, and my client wants there to be a button to download the image and a button to print the image, in addition to the regular nav items. There are no premade buttons for these functions in openseadragon, so I need to create the buttons manually. I have no idea how to do this, can anyone help me?

I need to: (1) Add new buttons to the viewer nav (2) Create functions to download and print the current image.

4

1 回答 1

1

(1) 我们的 openseadragon (OSD) 网站有类似的功能。我制作了一个包含默认按钮的自定义工具栏并添加了我们自己的按钮。自定义操作的绑定是通过简单地给 OSD 初始化元素的 id 来设置的。自定义按钮的绑定是“手动”完成的。html 代码可能如下所示：

<div id='viewerToolbar'>
<!-- Default buttons -->
<div class='toolbarItem' id='pv_home'></div>
<div class='toolbarItem' id='pv_zoom-in'></div>
<div class='toolbarItem' id='pv_zoom-out'></div>
<div class='toolbarItem' id='pv_full-page'></div>
<!-- custom actions -->
<div class='toolbarItem' id='customAction'>customAction</div>
<div class='toolbarItem' id='customAction2'>customAction2</div> 
</div>

OSD 设置如下：

OpenSeadragon({
  id: 'viewer',
  tileSources: 'DZI_URL'
  toolbar:'viewerToolbar',
  zoomInButton:   'pv_zoom-in',
  zoomOutButton:  'pv_zoom-out',
  homeButton:     'pv_home',
  fullPageButton: 'pv_full-page'
});

自定义按钮设置如下（jQuery）：

$( '#customAction' ).on( 'click', function() {
   //Do custom action
 });

$( '#customAction2' ).on( 'click', function() {
 //Do custom action 2
 });

(2) 我们创建了自己的服务来生成 PDF 供下载，用户也可以打印。我认为这比尝试从 OSD 打印/下载更容易并且提供更可靠的结果。您可能会遇到以下问题：打印是从当前缩放级别完成的；解决问题；您必须等到瓷砖完全加载后才能创建用于下载的 png 等。

于 2014-12-04T10:15:25.600 回答