Hi Alan,
Alan Deikman <[email protected]> wrote on 03/27/2009 08:35:15 PM:
> So far so good. The next step is what I need help with, which is to
> scale, translate, and possibly rotate the sub-document in "node" to a
> fixed place in "root." I have the target position as follows:
>
> SVGGraphicsElement position = (SVGGraphicsElement)
> ourDoc.getElementByID("xyzzy");
> SVGRect targetRect = position.getBBox();
>
> So what is the most efficient way to get "node" to appear exactly on top
> of "targetRect?" I have gotten hopelessly confused over the various
> viewports, viewboxes, and transforms involved.
> I may also need to rotate node by 90 degrees. Since node is an SVG
> element, it won't take a transform, so do I need to encapsulate it
> inside a G element?
Right. The easiest way to map things is to get the bbox of
'node' (same as position above). Then you can map the center of
the node bbox to 0,0:
translate(-nodeRect.X+nodeRect.Width/2, -nodeRect.Y+nodeRect.Height/2)
Then scale the width and height of 'node' to match
targetRect (take into account rotation if needed):
scale(targetRect.Width/nodeRect.Width,
targetRect.Height/nodeRect.Height)
Then translate it back to the center of the targetRect.
translate(targetRect.X+targetRect.Width/2,
targetRect.Y+targetRect.Height/2)
They need to appear in 'reverse order' (IIRC) so:
<g transform="translate(targetRect.X+targetRect.Width/2,
targetRect.Y+targetRect.Height/2);
scale(targetRect.Width/nodeRect.Width,
targetRect.Height/nodeRect.Height);
translate(-nodeRect.X+nodeRect.Width/2,
-nodeRect.Y+nodeRect.Height/2);">
