Support for rotation in Canvas Panel

[danieltbrennan]

Looking at supporting basic rotation of images on a canvas via the rotation parameter of an image service request and roughly using the way this works in the atlas world object as my guide.

While I'm able to provide a rotation value in CanvasPanel via a prop that will renders an image with the appropriate degree of rotation (*currently only concerned with increments of 90), the piece of this that I'm unsure of and feel like I'm missing is exactly where to capture that rotation value from the image service param so that it can be passed through to the world object. Is this something that should/could be handled in the rendering strategy in react-iiif-vault or does it potentially already exist elsewhere that I'm overlooking?

[stephenwf]

A few relevant pieces on rotation.

Example of defining the rotation in the IIIF:
https://github.com/digirati-co-uk/delft-exhibition-converter/blob/main/converted/corona-chronicles.json#L158-L162

At the moment we use this same method for cropping.
https://github.com/IIIF-Commons/iiif-helpers/blob/0f582fbcf4a8899258b7a71d2216ffeb56275de4/src/annotation-targets/parse-selector.ts#L103-L118

There is a concept in the selectors iiifRenderingHints that contains this extra information when you run parseSelector(). You can see the hints parsed here too:
https://github.com/IIIF-Commons/iiif-helpers/blob/0f582fbcf4a8899258b7a71d2216ffeb56275de4/src/annotation-targets/parse-selector.ts#L496-L519

BoxSelector does support rotation (in theory!)
https://github.com/IIIF-Commons/iiif-helpers/blob/0f582fbcf4a8899258b7a71d2216ffeb56275de4/src/annotation-targets/selector-types.ts#L42

So it's a property of the selector itself. However, the order that its applied isn't handled anywhere yet. Manifest editor did have an implementation that applied the rotation before positioning. So a 100x200 box that's been rotated 90deg was expected to have a target of 200x100 (again - this turned out to be wrong!).

Atlas allows you to rotate an object similar to how you can rotate an DOM element, it doesn't change it's position, just rotates around it's center. However, according to the specification, it needs to rotate but still fit inside the target (with the associated maths).

So a path to full rotation support:

• Extracting the rotation, similar to the cropping
• Adding rotation to the BoxSelector when parsing
• Adding rotation to the ImageStrategy (placeholder in the types now)
• Code for calculating an Atlas compatible translation + rotation (scaling down + translating from a BoxSelector + Rotation)
• Changing the draw calls to use these new parameters