I’ve been playing with a Javascript program which is composed of an HTML5 Canvas that can be panned and zoomed. Text can also be added and a bounding box is initially generated for it. I’ve got the program to account for the panning transformations, but I’m unable to get the bounding box to account for the scaling/zooming in and out. The initial bounding box is also not perfect, although it works when you try to click and drag the text, it is off by quite a bit.
Please help me figure out how to fix these issues.
Here is the program: https://jsfiddle.net/HappyAcorn77/hekagmb2/2/
/* I use this code to account for panning transformations for the bounding box on line
362
The Zooming/Scaling function can be found on line 372 which is what I am unable to
adjust the bounding box for.
*/
- Click and hold to drag the text
- Left click to default to inital display transformation values