RE: Efficient way of "selecting" an element?

Bishop, Michael W. CONTR J9C880 Mon, 24 Oct 2005 13:06:14 -0700

OK, this nearly works, but not quite:

I draw a rectangle with x,y,w,h and no fill color. I can only “capture” this element as the event target if I click on the rectangle itself; I cannot click inside of it. If I create a rectangle WITH a fill color, I can click inside of it. Is there anyway to trigger the event in the case without a fill color? Should I set the fill color as the background color??? That seems kind of like a hack.

Michael Bishop

From: Andres Toussaint [mailto:[EMAIL PROTECTED]
Sent: Monday, October 24, 2005 3:26 PM
To: [email protected]
Subject: Re: Efficient way of "selecting" an element?

You can do the following to retrieve the element that triggered the action:

Element trigger = (Element)evt.getTarget();

The SVGLocatable gives you access to matrix information about the specific Element. (to transform from screen coordinates to SVG coordinates)

You do not need to check for your elements unless you have "live" and "sleeping" elements in the same group that has the listener, if not, only when you are over an element within the group, the event will be triggered.

The Listener will listen for events within its scope (a listener in a G element will only listen for events that happen to its children) so if there is no object indicated as background, no event will be triggered.

Some case scenario, in case you want to capture DE-SELECT click also:

Sample SVG snippet (not well formed):

<rect x=0 y=0 width=100% height=100% fill=red /> -- May be a background inert object

</g>

</svg>

public class OnClickAction implements EventListener {

public void handleEvent(Event evt) {

Element theActionEvent = (Element)evt.getTarget();

if (theActionEvent.getAttribute("id")="background") {

//The user clicked on the "background" object, perform

//Deselect options

} else {

// Convert the screen coordinates into SVG coordinate space

SVGLocatable thisNode = (SVGLocatable)evt.getTarget();

DOMMouseEvent elEvt = (DOMMouseEvent)evt;

int nowToX = elEvt.getClientX();

int nowToY = elEvt.getClientY();

// Convert Screen coordinates to Document Coordinates.

SVGOMPoint pt = new SVGOMPoint(nowToX, nowToY);

SVGMatrix mat = thisNode.getScreenCTM(); // elem -> screen

mat = mat.inverse(); // screen -> elem

initialDragPoint = (SVGOMPoint)pt.matrixTransform(mat);

//initialDragPoint has the mouseEvent coordinates in the SVG

//coordinate space.

// At this point you can do whatever you what with your selected

// Element, for instance, change its opacity, to denote the selection:

theActionEvent.setAttribute("opacity","0.5");

}

regards,

Andres.

On Oct 24, 2005, at 2:23 PM, Bishop, Michael W. CONTR J9C880 wrote:

OK, well thanks to the two of you, I'm on the path to implementing this

functionality. I do use ALWAYS_DYNAMIC for my document since I'm

consistently adding and removing elements from it. I do have one

question about this tutorial at:

http://wiki.apache.org/xmlgraphics-batik/DragTutorial

How do I get which Element I'm clicking in? There's a commented area

that says "This is where you set your selected element, validate, etc."

but I don't know how to do that.

If I click on a JSVGCanvas, I need to know if I'm inside one of my

Elements. If I am, I can drag it, if I'm not (i.e. a blank piece of

JSVGCanvas), there's nothing to drag.

I think this is based on the SVGLocatable which is defined as

"thisNode", but how do I get from it to an Element? What happens if

there is no element where I click? Is there documentation I can read

about this? There is none in the JavaDoc for SVGLocatable, so

understanding precisely what that object is, is my stumbling block.

Michael Bishop

-----Original Message-----

From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]

Sent: Monday, October 24, 2005 1:51 PM

To: [email protected]

Cc: [email protected]

Subject: RE: Efficient way of "selecting" an element?

Hi Michael,

"Bishop, Michael W. CONTR J9C880" <[EMAIL PROTECTED]> wrote on

10/24/2005 01:46:18 PM:

Just to be clear, I?m doing this in Java, not the SVG-supported

_javascript_.

Nonetheless, this drag tutorial seems to be precisely what I?m looking

for.

Does it require _javascript_ (or anything else extra) to be present in

the

document?

All of the dynamic stuff is fully available in Java as well as in

_javascript_

(EcmaScript). If you don't have any obvious dynamic elements in your

document

then you need to inform Batik to treat your document as dynamic, using

JSVGComponent.setDocumentState(ALWAYS_DYNAMIC).

You will have to add your listeners using the DOM interfaces

(addEventListener) instead of using the event attributes

(on click etc).

From: Andres Toussaint [mailto:[EMAIL PROTECTED]

Sent: Monday, October 24, 2005 1:19 PM

To: [email protected]

Subject: Re: Efficient way of "selecting" an element?

SVG has the ability to dispatch events based on mouse actions, and the

event

holds the object that triggered the event (which is not necessarily

the

object

holding the listener, in case it is a group), for example:

<g >

<rect id="object 1" ...../>

<rect id="object 2" ...../>

<rect id="object 3" ...../>

<rect id="object 4" ...../>

</g>

the event will be activated and dispatched only when the click is

inside

any

of the rect objects, and the evt.target will tell you what is the

clicked object.

You may also see the dragTutorial in the batik wiki to see how to add

listeners in the code:

http://wiki.apache.org/xmlgraphics-batik/DragTutorial

regards,

Andres.

p.s. the same is true for all other mouse events.

On Oct 24, 2005, at 1:04 PM, Bishop, Michael W. CONTR J9C880 wrote:

I have a scenario where I?d like to click in the JSVGCanvas and

?select?

the

SVG element I?m clicking inside of. Short of iterating through the

document

and creating Java2D objects in which to check to see if my clicked

point

is

?inside? of, is there a way in Batik to see which elements a point

resides in?

Michael Bishop

---------------------------------------------------------------------

To unsubscribe, e-mail: [EMAIL PROTECTED]

For additional commands, e-mail: [EMAIL PROTECTED]

---------------------------------------------------------------------

To unsubscribe, e-mail: [EMAIL PROTECTED]

For additional commands, e-mail: [EMAIL PROTECTED]

RE: Efficient way of "selecting" an element?

Reply via email to