These are chat archives for openseadragon/openseadragon

25th
Jun 2016
Jeffrey Hann
@obihann
Jun 25 2016 15:40 UTC
I'm having an issue with placing overlays right now, they are not in the correct position and move to an even worse location on zoom
I have x, y coords that are relative to the image in px, so if I was to do this in pure css they would be absolute in a relative container holding the image
Jeffrey Hann
@obihann
Jun 25 2016 15:47 UTC
                var  point =  new OpenSeadragon.Point(),
                point.x = pin.x;
                point.y = pin.y;

                var overlay = {
                    location: viewer.viewport.pointFromPixel(pin.point),
                    element: id
                    placement: 'TOP',
                    checkResize: false
                };
If I don't set my point up that way, if I pass x and y to the constructor, the result is a point of 0, 0
My viewer is loading a jpeg image like this
            viewer = OpenSeadragon({
                id: 'beta16_map',
                defaultZoomLevel: 1,
                prefixUrl: 'images/',
                showNavigator: false,
                tileSources: {
                    type: 'image',
                    url:  'images/map.jpg',
                },
            });
then I add the overlays like so (they are stored in an array)
            _.each(pinData, function(p) {
                viewer.addOverlay(p.overlay);
            });
Jeffrey Hann
@obihann
Jun 25 2016 17:54 UTC
interisting, to get my overlay items to show close the correct place, I had to divide their px by 4.2 then use the provided functions
they are still not perfect but close
Antoine Vandecreme
@avandecreme
Jun 25 2016 20:51 UTC

If I don't set my point up that way, if I pass x and y to the constructor, the result is a point of 0, 0

Make sure to pass numbers and not string to the constructor

regarding, your overlay location, it looks like you have image coordinates, so it should be:
location: viewer.viewport.imageToViewportCoordinates(pin.point),
@obihann ^
Jeffrey Hann
@obihann
Jun 25 2016 20:54 UTC
@avandecreme I'll give that a try now, thanks
Jeffrey Hann
@obihann
Jun 25 2016 21:01 UTC
wrapping the values in parseInt helped me pass them directly to the constructor
however imagetoViewportCoordinates caused my overlays to be very very out of place
for example with pointFromPixel rendered on screen, on overlay is at 138px top 87px left
with the imageToViewportCoordinates I'm getting top 199007px left 74962px
Antoine Vandecreme
@avandecreme
Jun 25 2016 21:04 UTC
what is your image size and the location the overlay should be?
Jeffrey Hann
@obihann
Jun 25 2016 21:06 UTC
the image is 2580 × 3598, and based on that size, the overlay should be at top 1397px left 528px
I have to divide those numbers by 4.2 when I create my point object, by doing that and using pointFromPixel, they appear almost dead on
Is it a correct assumption that because the image is somewhat large, and the actual div that openseadragon is in is 600px by 600px, the image is scaled down, so I have to compensate for that when I create the point?
Antoine Vandecreme
@avandecreme
Jun 25 2016 21:08 UTC
so, in viewport coordinates, the location is (0.225, 0.541)
can you try setting:
location: new Point(0.225, 0.541)
Jeffrey Hann
@obihann
Jun 25 2016 21:09 UTC
ok
Antoine Vandecreme
@avandecreme
Jun 25 2016 21:09 UTC
Is it a correct assumption that because the image is somewhat large, and the actual div that openseadragon is in is 600px by 600px, the image is scaled down, so I have to compensate for that when I create the point?
osd should do that for you
Jeffrey Hann
@obihann
Jun 25 2016 21:14 UTC
about the same to be honest
my defaultZoomevel is set to 1, if that is effecting anything
Antoine Vandecreme
@avandecreme
Jun 25 2016 21:15 UTC
well, I'm out of ideas. If you could post an example somewhere I could look at it.
Jeffrey Hann
@obihann
Jun 25 2016 21:20 UTC
I'll see if I can get a demo up somewhere, I'll have to replace the main image with something, but I'll message you if I can get it up
Either way, thanks for the time and help
Antoine Vandecreme
@avandecreme
Jun 25 2016 21:20 UTC
no problem