javascriptgeometryiiif

How to calculate the height and width of a IIIF rotated image


I want to overlay historic aerial photographs onto a map, using the image rotation available in IIIF. The problem that I am facing is that using code such as in http://jsfiddle.net/jamesinealing/tr7obasm/ I need to manually calculate the NW and SE points, which alter based on the rotation, in advance of placing the image on the map.

What I am looking to do is to calculate the pixel dimensions of the new rotated image (the bounding box, if you like) and then use those to at least get something approximate for the lat lng coordinates, which I can then tweak.

My test code for the calculation is at http://jsfiddle.net/jamesinealing/ehp65gy1/ (based on https://stackoverflow.com/a/17453766)

var rotation=30;
var angle=rotation;
// var angle=((360-rotation) % 180);
var imgWidth=300;
var imgHeight=224;
w = Math.sin(angle * Math.PI/180) * imgHeight + Math.cos(angle * Math.PI/180) * imgWidth;
h = Math.sin(angle * Math.PI/180) * imgWidth + Math.cos(angle * Math.PI/180) * imgHeight;

The problem is that it only works up to a 90 degree angle, whilst the IIIF rotation is any value 0-359. I appreciate that any value 180 or above will yield the same results, so some sort of modulus is needed anyway, but can't get my head around why it isn't working over 90 degrees!


Solution

  • The dimensions of the new box only vary according to angle % 90, i.e. between 300*224 and 224*300 on an ellipse, so you could just use Math.abs with the adjusted angle and some if statements to work out which way round it should be.