Manu
Manu

Reputation: 219

Openseadragon image cordinates

iam doing a project using openseadragon check out the below example. a samle openseadragon image

In the Onclick method want to find the cordinates(px,py) of the image.Is there any method?? please help this is ma first openseadragon project.

thanks

Upvotes: 1

Views: 4006

Answers (2)

iangilman
iangilman

Reputation: 2174

When you get a click, it'll be in window pixel coordinates. You can then translate it into viewport coordinates (which go from 0.0 on the left to 1.0 on the right). You can then translate those into image coordinates. Here's how it would look all together:

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);
});

For more info on the coordinate systems, see: http://openseadragon.github.io/examples/viewport-coordinates/

Upvotes: 5

some-non-descript-user
some-non-descript-user

Reputation: 616

The following code, adapted from @iangilman's answer, worked for me with OpenSeadragon 2.0.0. It seems that the second argument of the handler function got removed in more recent versions. I added the quick === true condition to keep it from firing on a drag start. It might also be a good idea to switch of the default single-click-to-zoom behaviour in the gestureSettingsMouse object.

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));
        }
});

Upvotes: 1

Related Questions