Hi all, I'm still having a problem finding out if a select box drawn on the canvas completely bounds an element drawn on a document because I can't get my coordinate systems straight. So I figure I need to get my understanding of CTMs correct. SVGLocatable.getCTM(): This CTM is from what I understand, the "transform" applied to that element. SVGLocatable.getScreenCTM(): This CTM transforms points from document coordinates to screen (canvas) coordinates. In an attempt to find out if a select box drawn with the mouse completely bounds other elements, I decided to try and transform everything to document coordinates. ---------------- Select Box ---------------- When the mouse is pressed, I record the x, y coordinates as given from a MouseEvent attached to the JSVGCanvas. When the mouse is dragged and released, I record the x, y coordinates again. Now I have a select box in mouse/canvas coordinates. Now I take those coordinates and push them through the document's root element inverse of the screen CTM: SVGLocatable rootLoc = (SVGLocatable) svgDocument.getDocumentElement(); SVGMatrix matrix = rootLoc.getScreenCTM().inverse(); This SHOULD be transforming the select box from mouse/canvas coordinates to document coordinates. -------------- Elements -------------- Elements already on the document are drawn in a similar manner. In the case of a <rect> element, I record x and y as stated above and create a <rect> element with x, y, w, and h. Then I give the <rect> element a transform attribute that represents the inverse of the JSVGCanvas's viewing transform. This way, a user can draw what they see no matter how the canvas is translated, zoomed, etc. In order to translate an element to proper document coordinates, I get the bounding box of the element (SVGLocatable.getBBox), then push that bounding box through the element's CTM (SVGLocatable.getCTM). At this point, both the select box and the potentially selected elements SHOULD be in the same coordinate system. ----------- Results ----------- I get expected results MOST of the time. This works perfectly (zoom, pan, etc) UNLESS the size of the document does not match the size of the canvas. An 800x600 document in a 800x600 canvas works perfectly. A 1000x600 document in a 800x600 canvas (letterboxing on the top and bottom) does NOT. I'm definitely doing something wrong, but I'm not sure what and I keep coming back to this problem week after week. Someone's got to understand what's going on. The end goal is simply to have the select box and the elements in the same coordinate system so I can figure out which elements are bounded by the select box. ---------------------------------------------------------------------------------------------------------------------------------- Select Coodinates -> rootElement.getScreenCTM().inverse() == Document coordinates (?) Element Bounding Box -> element.getCTM() == Document coordinates (?) This works unless canvas size <> document size. ---------------------------------------------------------------------------------------------------------------------------------- Any guidance is much appreciated. Michael Bishop
--------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
