Drag and Drop Into Viewports

This example shows dragging elements and dropping them into the various viewPorts(SVG roots). Uses matrix transforms. It can seamlessly drag/drop elements that have previously been transformed and reside it different viewPorts. It employs getScreenCTM, createSVGTransform and binds the element to a transform List Each viewport target is determined by using an SVGRect object and employes checkIntersection.
Works in IE/CH. *FF is in the process of implementing the checkIntersection method
Scenerio:
The parent SVG root(mySVG) with viewBox=0 0 400 400.
It contains draggable red circles.
Draggable circles inside the rect viewPorts accept the viewPorts's fill color.
1.) The blue rect element is contained in, and fills, its own svg root
3.) The maroon rect element is contained in, and fills, its own svg root.
4.) The orange rect element is contained in, and fills, its own svg root
with viewPort=10 10 50 50.

(View the SVG Source to verify where the circles are being dropped.)

SVG Source:
Javascript: