Openseadragon image cordinates

Question

iam正在使用openseadragon进行项目查看下面的示例。一个samle openseadragon图像

在Onclick方法中，想要找到图像的堇青石（px，py）。有什么方法吗？？请帮忙，这是马的第一个openseadragon项目。

感谢

Answer 1

点击时，它将位于窗口像素坐标中。然后可以将其转换为视口坐标（从左侧的0.0到右侧的1.0）。然后可以将这些转换为图像坐标。以下是它的整体外观：

viewer.addHandler('canvas-click', function(event) {
  var viewportPoint = viewer.viewport.pointFromPixel(event.position);
  var imagePoint = viewer.viewport.viewportToImageCoordinates(viewportPoint.x, viewportPoint.y);
  console.log(imagePoint.x, imagePoint.y);
});

有关坐标系的更多信息，请参见：http://openseadragon.github.io/examples/viewport-coordinates/

Answer 2

以下代码改编自@iangilman的回答，适用于OpenSeadragon 2.0.0。处理程序函数的第二个参数似乎在最近的版本中被删除了。我添加了quick === true条件以防止它在拖动启动时启动。在gestureSettingsMouse对象中切换默认的单击缩放行为可能也是一个好主意。

viewer = OpenSeadragon({
    id: "osd1",
    prefixUrl: "/path/to/seadragon/images/",
    tileSources: "/path/to/tif/images/image.tif.dzi",
    showNavigator:  true,
    gestureSettingsMouse: {
        clickToZoom: false,
        dblClickToZoom: true
    }
});
viewer.addHandler('canvas-click', function(target) {
    if(target.quick === true){
        var viewportPoint = viewer.viewport.pointFromPixel(target.position);
        var imagePoint = viewer.viewport.viewportToImageCoordinates(viewportPoint.x, viewportPoint.y);
            console.log(parseInt(imagePoint.x), parseInt(imagePoint.y));
        }
});