locate an SVG element using x, y position

[HODAC, Olivier]

Hello,

I’d like to add a mouse listener on my JSVGCanvas to select an element of my rendered SVG.

How can I find the right node using x,y mouse postion?

Olivier Dao Ho Dac

Flight Test Software Architect

Airbus - EVIDA

Phone : + 33 (0)5 67 19 81 34

Fax : [phone]

Mailto:olivier.hodac@...

The information in this e-mail is confidential. The contents may not be disclosed or used by anyone other than the addressee. Access to this e-mail by anyone else is unauthorised.
If you are not the intended recipient, please notify Airbus immediately and delete this e-mail.
Airbus cannot accept any responsibility for the accuracy or completeness of this e-mail as it has been sent over public networks. If you have any concerns over the content of this message or its Accuracy or Integrity, please contact Airbus immediately.
All outgoing e-mails from Airbus are checked using regularly updated virus scanning software but you should take whatever measures you deem to be appropriate to ensure that this message and any attachments are virus free.

[Heidrun Beer]

On Mon, 26 Oct 2009 10:44:49 +0100, HODAC, Olivier wrote in
<1950_1256550419_4AE57013_1950_34_1_0471C9AC78F671458C5E3F9C69B73C8609879CB1@...>:

>I'd like to add a mouse listener on my JSVGCanvas to select an element
>of my rendered SVG.
>How can I find the right node using x,y mouse postion?


I have explored that, but the problem is that you have
only the bounds of the element to locate your mouse point
in. This is a rectangle. If now the element is, say, an
ellipse or a line or another shape that is not rectangular,
the function won't work with mouse points inside that
rectangle, but outside the shape.

You need to add an event listener to each element as
you create it. If you load your drawing from a file,
you need to loop through the whole element tree and
add it to each element. It's not so much code, as
you do it all in a loop.

Here is the code that I am using, after I have retrieved
my document string from a database and created the document.

I have the special situation that I skip the first element,
which is a background rectangle that I don't want to be
moveable. It is always the first in the document.


            BackG = doc.getElementById("BackgroundRectangle");
            EventTarget etr = null;
            Node no = (Node) BackG;
            Node no2 = no.getNextSibling();
            if (no2!=null) {
                do {
                    etr = (EventTarget) no2;
                    etr.addEventListener("click",new org.w3c.dom.events.EventListener()
                    {
                        org.w3c.dom.events.Event evt;

                        public void handleEvent(org.w3c.dom.events.Event evt) {
                            EventTarget etr2 = evt.getTarget();

                            ActivateSelEl(etr2); // function that selects the element,
                                                 // retrieves its bounds and sets a flag
                                                 // that tells the canvas to paint a
                                                 // selection rectangle with mouse
                                                 // anchors on top of the SVG drawing
                                                 // in its paint function
                            repaint();
                        }
                        public void run() {
                            handleEvent(evt);
                        }

                    },false
                    );
                    no2=no2.getNextSibling();
                } while (no2!=null);
            }



Best,


Heidrun Beer

Workgroup for Fundamental Spiritual Research and Mental Training
http://www.sgmt.at
http://www.RecastReality.org


---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@...
For additional commands, e-mail: batik-users-help@...

[thomas.deweese]

Hi Heidrun, HODAC,

> On Mon, 26 Oct 2009 10:44:49 +0100, HODAC, Olivier wrote:
>
> >I'd like to add a mouse listener on my JSVGCanvas to select an element
> >of my rendered SVG.
> >How can I find the right node using x,y mouse postion?

    I suggest following Heidrun's suggestion of adding a mouse
event listener (click, mouseOver, mouseExit, etc), although I would
suggest doing it a different way.

    However another approach would be to use the 'getIntersectionList'
method available on the svg:svg element.

    I suggest reading the DOM2 Events specification as it offers
everything most people need in this area:
        http://www.w3.org/TR/DOM-Level-2-Events/

Heidrun Beer <hBeer@...> wrote on 10/26/2009 06:59:11 AM:

> You need to add an event listener to each element as
> you create it. If you load your drawing from a file,
> you need to loop through the whole element tree and
> add it to each element. It's not so much code, as
> you do it all in a loop.

    Actually if you want to be notified of all mouse events
I would suggest registering one listener on the root
SVG element (probably during the capture phase).  You can
then use the target field to know what element the
event is targeted for.

> I have the special situation that I skip the first element,
> which is a background rectangle that I don't want to be
> moveable. It is always the first in the document.

   This can be handled with the one event listener by simply
skipping events that have the background rectangle as the
event target.

   The one listener approach will also save considerably on
memory.

[HODAC, Olivier]

Some parts of this message have been removed. Learn more about Nabble's security policy.

Seems to be a good Idea, this getIntersectionList with a 1pixel rect, isn’t it?

 

I am looking at the Dom specification, but it seems that I have not the right technic to sniff around W3C documentation (tell me how to search?).

 

Anyway, I have tried 2 codes:

 

ONE

I try to get a viewportElement (assuming that it is the displayed rect to pass as an argument to the function.:

            SVGElement viewportElement = canvas.getSVGDocument().getRootElement().getViewportElement();

 

Unfortunately, it returns null. Do you know why ? what’s the difference with the getViewport()?

 

TWO

I pass the root element to the function. It fails with nullpointerexception.

 

Any idea?

While waiting, I’ll try the Heidrun method.

 

 

De : thomas.deweese@... [mailto:thomas.deweese@...]
Envoyé : lundi 26 octobre 2009 13:44
À : batik-users@...
Cc : batik-users@...
Objet : Re: locate an SVG element using x, y position

 

Hi Heidrun, HODAC,

> On Mon, 26 Oct 2009 10:44:49 +0100, HODAC, Olivier wrote:
>
> >I'd like to add a mouse listener on my JSVGCanvas to select an element
> >of my rendered SVG.
> >How can I find the right node using x,y mouse postion?

    I suggest following Heidrun's suggestion of adding a mouse
event listener (click, mouseOver, mouseExit, etc), although I would
suggest doing it a different way.

    However another approach would be to use the 'getIntersectionList'
method available on the svg:svg element.

    I suggest reading the DOM2 Events specification as it offers
everything most people need in this area:
        http://www.w3.org/TR/DOM-Level-2-Events/

Heidrun Beer <hBeer@...> wrote on 10/26/2009 06:59:11 AM:

> You need to add an event listener to each element as
> you create it. If you load your drawing from a file,
> you need to loop through the whole element tree and
> add it to each element. It's not so much code, as
> you do it all in a loop.

    Actually if you want to be notified of all mouse events
I would suggest registering one listener on the root
SVG element (probably during the capture phase).  You can
then use the target field to know what element the
event is targeted for.

> I have the special situation that I skip the first element,
> which is a background rectangle that I don't want to be
> moveable. It is always the first in the document.

   This can be handled with the one event listener by simply
skipping events that have the background rectangle as the
event target.

   The one listener approach will also save considerably on
memory.

This mail has originated outside your organization, either from an external partner or the Global Internet.

Keep this in mind if you answer this message.

The information in this e-mail is confidential. The contents may not be disclosed or used by anyone other than the addressee. Access to this e-mail by anyone else is unauthorised.
If you are not the intended recipient, please notify Airbus immediately and delete this e-mail.
Airbus cannot accept any responsibility for the accuracy or completeness of this e-mail as it has been sent over public networks. If you have any concerns over the content of this message or its Accuracy or Integrity, please contact Airbus immediately.
All outgoing e-mails from Airbus are checked using regularly updated virus scanning software but you should take whatever measures you deem to be appropriate to ensure that this message and any attachments are virus free.

[thomas.deweese]

Hi HODAC,

"HODAC, Olivier" <OLIVIER.HODAC@...> wrote on 10/26/2009 10:31:25 AM:

> Seems to be a good Idea, this getIntersectionList with a 1pixel
> rect, isn’t it?

   Right, but I think I confused you a little.  

> I am looking at the Dom specification, but it seems that I have not
> the right technic to sniff around W3C documentation (tell me how to search?).

    www.google.com ;)

    More seriously you can download most W3C Specs as PDF.

> ONE
> I try to get a viewportElement (assuming that it is the displayed
> rect to pass as an argument to the function.:
>             SVGElement viewportElement = canvas.getSVGDocument
> ().getRootElement().getViewportElement();
>  
> Unfortunately, it returns null. Do you know why ? what’s the
> difference with the getViewport()?

    The root SVG element has now ViewportElement since it is the
topmost ViewportElement.

> TWO
> I pass the root element to the function. It fails with nullpointerexception.

    Any more info on the NPE or how you called the function?

> While waiting, I’ll try the Heidrun method.

    Actually Heidrun's method is my recommended solution but not
by adding a listener to every element.  Simply add one listener
to the root of the SVG tree and check the 'target' field to know
what element the hit was on (that is what I meant by 'doing it a
different way').

> De : thomas.deweese@... [mailto:thomas.deweese@...]
> Envoyé : lundi 26 octobre 2009 13:44
> À : batik-users@...
> Cc : batik-users@...
> Objet : Re: locate an SVG element using x, y position
>  
> Hi Heidrun, HODAC,
>
> > On Mon, 26 Oct 2009 10:44:49 +0100, HODAC, Olivier wrote:
> >
> > >I'd like to add a mouse listener on my JSVGCanvas to select an element
> > >of my rendered SVG.
> > >How can I find the right node using x,y mouse postion?
>
>     I suggest following Heidrun's suggestion of adding a mouse
> event listener (click, mouseOver, mouseExit, etc), although I would
> suggest doing it a different way.
>
>     However another approach would be to use the 'getIntersectionList'
> method available on the svg:svg element.
>
>     I suggest reading the DOM2 Events specification as it offers
> everything most people need in this area:
>         http://www.w3.org/TR/DOM-Level-2-Events/
>
> Heidrun Beer <hBeer@...> wrote on 10/26/2009 06:59:11 AM:
>
> > You need to add an event listener to each element as
> > you create it. If you load your drawing from a file,
> > you need to loop through the whole element tree and
> > add it to each element. It's not so much code, as
> > you do it all in a loop.
>
>     Actually if you want to be notified of all mouse events
> I would suggest registering one listener on the root
> SVG element (probably during the capture phase).  You can
> then use the target field to know what element the
> event is targeted for.
>
> > I have the special situation that I skip the first element,
> > which is a background rectangle that I don't want to be
> > moveable. It is always the first in the document.
>
>    This can be handled with the one event listener by simply
> skipping events that have the background rectangle as the
> event target.
>
>    The one listener approach will also save considerably on
> memory.
> This mail has originated outside your organization, either from an
> external partner or the Global Internet.
> Keep this in mind if you answer this message.
>  
> The information in this e-mail is confidential. The contents may not
> be disclosed or used by anyone other than the addressee. Access to
> this e-mail by anyone else is unauthorised.
> If you are not the intended recipient, please notify Airbus
> immediately and delete this e-mail.
> Airbus cannot accept any responsibility for the accuracy or
> completeness of this e-mail as it has been sent over public
> networks. If you have any concerns over the content of this message
> or its Accuracy or Integrity, please contact Airbus immediately.
> All outgoing e-mails from Airbus are checked using regularly updated
> virus scanning software but you should take whatever measures you
> deem to be appropriate to ensure that this message and any
> attachments are virus free.

[HODAC, Olivier]

Thanks, I have implemented you solution but the event never comes. I am un eclipse behind a swing component wrapper. I don't know if the EventTarget actually received the event. How can I check that? I have seen that you register an event listener on the event type "click". It is hard coded. Is there a list of events as constants? Is it possible I register all the events to see if it is Eclipse that consumes the events forgetting to redispatch them?



-----Message d'origine-----
De : Heidrun Beer [mailto:hBeer@...]
Envoyé : lundi 26 octobre 2009 11:59
À : batik-users@...
Objet : Re: locate an SVG element using x, y position

On Mon, 26 Oct 2009 10:44:49 +0100, HODAC, Olivier wrote in
<1950_1256550419_4AE57013_1950_34_1_0471C9AC78F671458C5E3F9C69B73C8609879CB1@...>:

>I'd like to add a mouse listener on my JSVGCanvas to select an element
>of my rendered SVG.
>How can I find the right node using x,y mouse postion?


I have explored that, but the problem is that you have
only the bounds of the element to locate your mouse point
in. This is a rectangle. If now the element is, say, an
ellipse or a line or another shape that is not rectangular,
the function won't work with mouse points inside that
rectangle, but outside the shape.

You need to add an event listener to each element as
you create it. If you load your drawing from a file,
you need to loop through the whole element tree and
add it to each element. It's not so much code, as
you do it all in a loop.

Here is the code that I am using, after I have retrieved
my document string from a database and created the document.

I have the special situation that I skip the first element,
which is a background rectangle that I don't want to be
moveable. It is always the first in the document.


            BackG = doc.getElementById("BackgroundRectangle");
            EventTarget etr = null;
            Node no = (Node) BackG;
            Node no2 = no.getNextSibling();
            if (no2!=null) {
                do {
                    etr = (EventTarget) no2;
                    etr.addEventListener("click",new org.w3c.dom.events.EventListener()
                    {
                        org.w3c.dom.events.Event evt;

                        public void handleEvent(org.w3c.dom.events.Event evt) {
                            EventTarget etr2 = evt.getTarget();

                            ActivateSelEl(etr2); // function that selects the element,
                                                 // retrieves its bounds and sets a flag
                                                 // that tells the canvas to paint a
                                                 // selection rectangle with mouse
                                                 // anchors on top of the SVG drawing
                                                 // in its paint function
                            repaint();
                        }
                        public void run() {
                            handleEvent(evt);
                        }

                    },false
                    );
                    no2=no2.getNextSibling();
                } while (no2!=null);
            }



Best,


Heidrun Beer

Workgroup for Fundamental Spiritual Research and Mental Training
http://www.sgmt.at
http://www.RecastReality.org


---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@...
For additional commands, e-mail: batik-users-help@...


This mail has originated outside your organization, either from an external partner or the Global Internet.
Keep this in mind if you answer this message.




The information in this e-mail is confidential. The contents may not be disclosed or used by anyone other than the addressee. Access to this e-mail by anyone else is unauthorised.
If you are not the intended recipient, please notify Airbus immediately and delete this e-mail.
Airbus cannot accept any responsibility for the accuracy or completeness of this e-mail as it has been sent over public networks. If you have any concerns over the content of this message or its Accuracy or Integrity, please contact Airbus immediately.
All outgoing e-mails from Airbus are checked using regularly updated virus scanning software but you should take whatever measures you deem to be appropriate to ensure that this message and any attachments are virus free.


---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@...
For additional commands, e-mail: batik-users-help@...

[thomas.deweese]

Hi HODAC,

"HODAC, Olivier" <OLIVIER.HODAC@...> wrote on 10/26/2009 11:34:17 AM:

> Thanks, I have implemented you solution but the event never comes. I
> am un eclipse behind a swing component wrapper. I don't know if the
> EventTarget actually received the event. How can I check that?

   I don't know anything about Swing components embedded in SWT.
Does that forward event's to the Swing component?

   The other common problem is that you didn't set the canvas to
ALWAYS_DYNAMIC.

> I have seen that you register an event listener on the event type
> "click". It is hard coded. Is there a list of events as constants?
> Is it possible I register all the events to see if it is Eclipse
> that consumes the events forgetting to redispatch them?
>
>
>
> -----Message d'origine-----
> De : Heidrun Beer [mailto:hBeer@...]
> Envoyé : lundi 26 octobre 2009 11:59
> À : batik-users@...
> Objet : Re: locate an SVG element using x, y position
>
> On Mon, 26 Oct 2009 10:44:49 +0100, HODAC, Olivier wrote in
> <1950_1256550419_4AE57013_1950_34_1_0471C9AC78F671458C5E3F9C69B73C8609879CB1@fr0-
> mailmb17.res.airbus.corp>:
>
> >I'd like to add a mouse listener on my JSVGCanvas to select an element
> >of my rendered SVG.
> >How can I find the right node using x,y mouse postion?
>
>
> I have explored that, but the problem is that you have
> only the bounds of the element to locate your mouse point
> in. This is a rectangle. If now the element is, say, an
> ellipse or a line or another shape that is not rectangular,
> the function won't work with mouse points inside that
> rectangle, but outside the shape.
>
> You need to add an event listener to each element as
> you create it. If you load your drawing from a file,
> you need to loop through the whole element tree and
> add it to each element. It's not so much code, as
> you do it all in a loop.
>
> Here is the code that I am using, after I have retrieved
> my document string from a database and created the document.
>
> I have the special situation that I skip the first element,
> which is a background rectangle that I don't want to be
> moveable. It is always the first in the document.
>
>
>             BackG = doc.getElementById("BackgroundRectangle");
>             EventTarget etr = null;
>             Node no = (Node) BackG;
>             Node no2 = no.getNextSibling();
>             if (no2!=null) {
>                 do {
>                     etr = (EventTarget) no2;
>                     etr.addEventListener("click",new
> org.w3c.dom.events.EventListener()
>                     {
>                         org.w3c.dom.events.Event evt;
>
>                         public void handleEvent
> (org.w3c.dom.events.Event evt) {
>                             EventTarget etr2 = evt.getTarget();
>
>                             ActivateSelEl(etr2); // function that
> selects the element,
>                    // retrieves its bounds and sets a flag
>                    // that tells the canvas to paint a
>                    // selection rectangle with mouse
>                    // anchors on top of the SVG drawing
>                    // in its paint function
>                             repaint();
>                         }
>                         public void run() {
>                             handleEvent(evt);
>                         }
>
>                     },false
>                     );
>                     no2=no2.getNextSibling();
>                 } while (no2!=null);
>             }
>
>
>
> Best,
>
>
> Heidrun Beer
>
> Workgroup for Fundamental Spiritual Research and Mental Training
> http://www.sgmt.at
> http://www.RecastReality.org
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@...
> For additional commands, e-mail: batik-users-help@...
>
>
> This mail has originated outside your organization, either from an
> external partner or the Global Internet.
> Keep this in mind if you answer this message.
>
>
>
>
> The information in this e-mail is confidential. The contents may not
> be disclosed or used by anyone other than the addressee. Access to
> this e-mail by anyone else is unauthorised.
> If you are not the intended recipient, please notify Airbus
> immediately and delete this e-mail.
> Airbus cannot accept any responsibility for the accuracy or
> completeness of this e-mail as it has been sent over public
> networks. If you have any concerns over the content of this message
> or its Accuracy or Integrity, please contact Airbus immediately.
> All outgoing e-mails from Airbus are checked using regularly updated
> virus scanning software but you should take whatever measures you
> deem to be appropriate to ensure that this message and any
> attachments are virus free.
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@...
> For additional commands, e-mail: batik-users-help@...
>

[Heidrun Beer]

On Mon, 26 Oct 2009 16:34:17 +0100, HODAC, Olivier wrote in
<30419_1256571256_4AE5C178_30419_466_1_0471C9AC78F671458C5E3F9C69B73C8609879D9D@...>:

>Thanks, I have implemented you solution but the event never comes.
>I am un eclipse behind a swing component wrapper. I don't know
>if the EventTarget actually received the event. How can I check
>that? I have seen that you register an event listener on the event
>type "click". It is hard coded. Is there a list of events as
>constants? Is it possible I register all the events to see
>if it is Eclipse that consumes the events forgetting to
>redispatch them?


Hi Olivier,


difficult for me to say. I am a relative beginner in both
Java and Batik. I was happy to have an answer to your
question, but my IDE is not Eclipse, I am working in
NetBeans, and am in no way firm in all the lower level
compiler issues.

I am happy that I got it to work in my environment,
but more than that... sorry!

I have yet to see how it works with only one event
listener. The idea is very good, should save a lot
of memory and speed up performance, maybe you want
to try that?



All the best,


Heidrun Beer

Workgroup for Fundamental Spiritual Research and Mental Training
http://www.sgmt.at
http://www.RecastReality.org


---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@...
For additional commands, e-mail: batik-users-help@...

[HODAC, Olivier]

Some parts of this message have been removed. Learn more about Nabble's security policy.

I succeded in catching the event. Thanks, thomas, I had forgot the ALWAYS_DYNAMIC state.

The solution of Heidrun is the solution I have implemented as it seems that the evt.getTarget() seems not to point on the right node (in the case I use refs to symbols, see SVG). Do you know why? The getTarget() is not the right method to call?

 

Here is my SVG:

 

 

<?xml version="1.0" encoding="utf-8"?>

<!-- Generator: Adobe Illustrator 14.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 43363)  -->

<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg version="1.1" id="Calque_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"

                 width="595.28px" height="841.89px" viewBox="0 0 595.28 841.89" enable-background="new 0 0 595.28 841.89" xml:space="preserve">

<symbol  id="Button_rect" viewBox="-63.256 -53.15 126.513 106.3">

                <g>

                               <polygon points="63.131,-52.525 -63.131,-52.525 -63.131,52.524 63.131,52.524                        "/>

                              

                                               <radialGradient id="SVGID_1_" cx="18.3228" cy="-35.2949" r="92.3629" gradientTransform="matrix(1 0 0 0.4883 0 -18.0596)" gradientUnits="userSpaceOnUse">

                                               <stop  offset="0.4444" style="stop-color:#FFFFFF;stop-opacity:0"/>

                                               <stop  offset="0.9215" style="stop-color:#FFFFFF;stop-opacity:0.4637"/>

                                               <stop  offset="1" style="stop-color:#FFFFFF;stop-opacity:0.54"/>

                               </radialGradient>

                               <polygon opacity="0.58" fill="url(#SVGID_1_)" points="63.131,-52.525 -63.131,-52.525 -63.131,52.524 63.131,52.524                                "/>

                               <g opacity="0.49">

                                               <path fill="#FFFFFF" d="M-61.929-51.325c0,24.546,0,49.092,0,73.637c0,9.604,0,19.206,0,28.809

                                                               c0-0.095,18.148-0.045,19.727-0.045c30.026,0,60.053,0,90.08,0c4.018,0,8.036,0,12.054,0c2.12,0,1.997,0.576,1.997-1.523

                                                               c0-11.581,0-23.162,0-34.744c0-15.797,0-31.595,0-47.393c0-5.088,0-10.176,0-15.264c0-1.938,0.694-3.227-0.839-3.227

                                                               c-25.638,0-51.276,0-76.914,0c-15.369,0-30.738,0-46.106,0c-0.004,0-0.004-0.5,0-0.5c41.288,0,82.575,0,123.862,0

                                                               c0.003,0,0.002,0.236,0.002,0.25c0,34.217,0,68.434,0,102.65c0,0.013,0,0.25-0.002,0.25c-41.288,0-82.575,0-123.862,0

                                                               c-0.003,0-0.002-0.237-0.002-0.25c0-34.217,0-68.434,0-102.65C-61.934-51.608-61.929-51.608-61.929-51.325z"/>

                               </g>

                               <polygon fill="none" stroke="#39863F" stroke-width="0.25" stroke-miterlimit="1" points="63.131,-52.525 -63.131,-52.525

                                               -63.131,52.524 63.131,52.524                              "/>

                               <g opacity="0.58">

                                               <path d="M63.131-51.9c-22.704,0-45.407,0-68.111,0c-14.573,0-29.146,0-43.72,0c-4.065,0-8.13,0-12.195,0

                                                               c-0.714,0-1.429,0-2.144,0c-0.298,0-0.087-0.96-0.087-0.427c0,0.42,0,0.839,0,1.258c0,27.08,0,54.158,0,81.238

                                                               c0,5.604,0,11.209,0,16.813c0,1.445,0,2.89,0,4.334c0,1.584-0.103,0.584,0.159,0.584c8.211,0,16.423,0,24.634,0

                                                               c29.861,0,59.722,0,89.583,0c3.553,0,7.107,0,10.66,0c0.846,0,1.214-0.254,1.214,0.575c0-0.87,0-1.74,0-2.61

                                                               c0-12.016,0-24.032,0-36.049c0-22.113,0-44.227,0-66.341c0-0.707,0.013-0.707,0.013,0c0,35.017,0,70.034,0,105.05

                                                               c0,0.033,0.001,0.625-0.006,0.625c-42.087,0-84.175,0-126.263,0c-0.007,0-0.006-0.592-0.006-0.625c0-35.016,0-70.033,0-105.05

                                                               c0-0.032-0.001-0.625,0.006-0.625c42.087,0,84.175,0,126.263,0C63.141-53.15,63.141-51.9,63.131-51.9z"/>

                               </g>

                </g>

</symbol>

<use id="top" xlink:href="#Button_rect" fill="#0000FF"  width="126.513" height="106.3" x="-63.256" y="-53.15" transform="matrix(1 0 0 -1 143.3438 143.687)" overflow="visible"/>

<use id="middle" xlink:href="#Button_rect" fill="#00FF00"  width="126.513" height="106.3" x="-63.256" y="-53.15" transform="matrix(1 0 0 -1 237.2827 436.6162)" overflow="visible"/>

<use id="bottom" xlink:href="#Button_rect" fill="#ff0000"  width="126.513" height="106.3" x="-63.256" y="-53.15" transform="matrix(1 0 0 -1 396.8789 254.7979)" overflow="visible"/>

</svg>

 

When I write the following piece of code, I point on the polygon Node of the SVG which is the symbol element (=> no ID => NullPointerException). I want to get the use element (top, bottom or middle of the SVG)

 

                                                                              Node root = e.getSVGDocument().getRootElement();

                                                                              EventTarget etr = (EventTarget) root;

                                                                              etr.addEventListener("click",new org.w3c.dom.events.EventListener()

                    {

 

                        public void handleEvent(org.w3c.dom.events.Event evt) {

                               Node node = (Node) evt.getTarget();

                            try {

                                                                                                                             System.out.println("clicked " + node.getAttributes().getNamedItem("id").getNodeValue());

                                                                                                              } catch (Exception e) {

                                                                                                                             System.err.println("not usable element clicked");

                                                                                                              }

                        }

 

                    },false

                    );

 

 

Therefore, I wrote this one that works fine

 

                /**

                 * recursively finds the elements named symbol and put them in the symbolCollec

                 * @param symbolCollec collection of the symbols

                 * @param n node list to go thru and down

                 */

                private void findUseNodes (Collection<Node> symbolCollec, NodeList n) {

                               for (int i=0; i<n.getLength(); i++) {

                                               if (n.item(i).getNodeName().equals("use"))

                                                               symbolCollec.add(n.item(i));

                                               findUseNodes(symbolCollec, n.item(i).getChildNodes());

                               }

                }

 

                                                                              Collection<Node> symbolCollec = new HashSet<Node>();

                                                                              findUseNodes(symbolCollec,e.getSVGDocument().getChildNodes());

                                                                              Iterator<Node> it = symbolCollec.iterator();

                                                                              while (it.hasNext()) {

                                                                                              final Node node = (Node) it.next();

                                                                                              final String nodeId=node.getAttributes().getNamedItem("id").getNodeValue();

                                                                                              EventTarget etr = (EventTarget) node;

                                                                                              etr.addEventListener("click",new org.w3c.dom.events.EventListener()

                                    {

 

                                        public void handleEvent(org.w3c.dom.events.Event evt) {

                                               Node node = (Node) evt.getTarget();

                                            System.out.println("clicked " + nodeId);

                                        }

 

                                    },false

                                    );

                                                                              }

 

 

 

De : thomas.deweese@... [mailto:thomas.deweese@...]
Envoyé : lundi 26 octobre 2009 17:04
À : batik-users@...
Cc : batik-users@...
Objet : RE: locate an SVG element using x, y position

 

Hi HODAC,

"HODAC, Olivier" <OLIVIER.HODAC@...> wrote on 10/26/2009 11:34:17 AM:

> Thanks, I have implemented you solution but the event never comes. I
> am un eclipse behind a swing component wrapper. I don't know if the
> EventTarget actually received the event. How can I check that?

   I don't know anything about Swing components embedded in SWT.
Does that forward event's to the Swing component?

   The other common problem is that you didn't set the canvas to
ALWAYS_DYNAMIC.

> I have seen that you register an event listener on the event type
> "click". It is hard coded. Is there a list of events as constants?
> Is it possible I register all the events to see if it is Eclipse
> that consumes the events forgetting to redispatch them?
>
>
>
> -----Message d'origine-----
> De : Heidrun Beer [hBeer@...]
> Envoyé : lundi 26 octobre 2009 11:59
> À : batik-users@...
> Objet : Re: locate an SVG element using x, y position
>
> On Mon, 26 Oct 2009 10:44:49 +0100, HODAC, Olivier wrote in
> <1950_1256550419_4AE57013_1950_34_1_0471C9AC78F671458C5E3F9C69B73C8609879CB1@fr0-
> mailmb17.res.airbus.corp>:
>
> >I'd like to add a mouse listener on my JSVGCanvas to select an element
> >of my rendered SVG.
> >How can I find the right node using x,y mouse postion?
>
>
> I have explored that, but the problem is that you have
> only the bounds of the element to locate your mouse point
> in. This is a rectangle. If now the element is, say, an
> ellipse or a line or another shape that is not rectangular,
> the function won't work with mouse points inside that
> rectangle, but outside the shape.
>
> You need to add an event listener to each element as
> you create it. If you load your drawing from a file,
> you need to loop through the whole element tree and
> add it to each element. It's not so much code, as
> you do it all in a loop.
>
> Here is the code that I am using, after I have retrieved
> my document string from a database and created the document.
>
> I have the special situation that I skip the first element,
> which is a background rectangle that I don't want to be
> moveable. It is always the first in the document.
>
>
>             BackG = doc.getElementById("BackgroundRectangle");
>             EventTarget etr = null;
>             Node no = (Node) BackG;
>             Node no2 = no.getNextSibling();
>             if (no2!=null) {
>                 do {
>                     etr = (EventTarget) no2;
>                     etr.addEventListener("click",new
> org.w3c.dom.events.EventListener()
>                     {
>                         org.w3c.dom.events.Event evt;
>
>                         public void handleEvent
> (org.w3c.dom.events.Event evt) {
>                             EventTarget etr2 = evt.getTarget();
>
>                             ActivateSelEl(etr2); // function that
> selects the element,
>                    // retrieves its bounds and sets a flag
>                    // that tells the canvas to paint a
>                    // selection rectangle with mouse
>                    // anchors on top of the SVG drawing
>                    // in its paint function
>                             repaint();
>                         }
>                         public void run() {
>                             handleEvent(evt);
>                         }
>
>                     },false
>                     );
>                     no2=no2.getNextSibling();
>                 } while (no2!=null);
>             }
>
>
>
> Best,
>
>
> Heidrun Beer
>
> Workgroup for Fundamental Spiritual Research and Mental Training
> http://www.sgmt.at
> http://www.RecastReality.org
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@...
> For additional commands, e-mail: batik-users-help@...
>
>
> This mail has originated outside your organization, either from an
> external partner or the Global Internet.
> Keep this in mind if you answer this message.
>
>
>
>
> The information in this e-mail is confidential. The contents may not
> be disclosed or used by anyone other than the addressee. Access to
> this e-mail by anyone else is unauthorised.
> If you are not the intended recipient, please notify Airbus
> immediately and delete this e-mail.
> Airbus cannot accept any responsibility for the accuracy or
> completeness of this e-mail as it has been sent over public
> networks. If you have any concerns over the content of this message
> or its Accuracy or Integrity, please contact Airbus immediately.
> All outgoing e-mails from Airbus are checked using regularly updated
> virus scanning software but you should take whatever measures you
> deem to be appropriate to ensure that this message and any
> attachments are virus free.
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: batik-users-unsubscribe@...
> For additional commands, e-mail: batik-users-help@...
>

This mail has originated outside your organization, either from an external partner or the Global Internet.

Keep this in mind if you answer this message.

The information in this e-mail is confidential. The contents may not be disclosed or used by anyone other than the addressee. Access to this e-mail by anyone else is unauthorised.
If you are not the intended recipient, please notify Airbus immediately and delete this e-mail.
Airbus cannot accept any responsibility for the accuracy or completeness of this e-mail as it has been sent over public networks. If you have any concerns over the content of this message or its Accuracy or Integrity, please contact Airbus immediately.
All outgoing e-mails from Airbus are checked using regularly updated virus scanning software but you should take whatever measures you deem to be appropriate to ensure that this message and any attachments are virus free.

[thomas.deweese]

Hi Oliver,

"HODAC, Olivier" <OLIVIER.HODAC@...> wrote on 10/27/2009 12:51:13 PM:

> I succeded in catching the event. Thanks, thomas, I had forgot the
> ALWAYS_DYNAMIC state.

> The solution of Heidrun is the solution I have implemented as it
> seems that the evt.getTarget() seems not to point on the right node
> (in the case I use refs to symbols, see SVG). Do you know why? The
> getTarget() is not the right method to call?

   Well getTarget will point at the actual geometry element (like
a rect, text, or in your case a polygon).  In cases like this I
normally walk up the tree until I get to the desired element
(see 'getParent' on DOM Elements).  I'll often add an attribute in
a custom namespace rather than simply assume that the first symbol
is the right element.

> When I write the following piece of code, I point on the polygon
> Node of the SVG which is the symbol element (=> no ID =>
> NullPointerException). I want to get the use element (top, bottom or
> middle of the SVG)

   One thing to watch for is that the element it points at will be
in a 'shadow tree' (a copy we make so we can properly perform the
CSS cascade).  So you need to do some fancy footwork to navigate across
the symbol->use boundary (see batik.dom.svg.SVGOMUseShadowRoot.getCSSParentNode).

[HODAC, Olivier]

Some parts of this message have been removed. Learn more about Nabble's security policy.

Thomas.

 

Just to end it, I finnally have created as many listener as I have use components. And instead of navigating the SVG to perform the symbol->use path, I keep the node ref in the listener so I get the use node immediately.

 

Thank’s everybody

 

 

De : thomas.deweese@... [mailto:thomas.deweese@...]
Envoyé : mercredi 28 octobre 2009 11:04
À : batik-users@...
Cc : batik-users@...
Objet : RE: locate an SVG element using x, y position

 

Hi Oliver,

"HODAC, Olivier" <OLIVIER.HODAC@...> wrote on 10/27/2009 12:51:13 PM:

> I succeded in catching the event. Thanks, thomas, I had forgot the
> ALWAYS_DYNAMIC state.

> The solution of Heidrun is the solution I have implemented as it
> seems that the evt.getTarget() seems not to point on the right node
> (in the case I use refs to symbols, see SVG). Do you know why? The
> getTarget() is not the right method to call?

   Well getTarget will point at the actual geometry element (like
a rect, text, or in your case a polygon).  In cases like this I
normally walk up the tree until I get to the desired element
(see 'getParent' on DOM Elements).  I'll often add an attribute in
a custom namespace rather than simply assume that the first symbol
is the right element.

> When I write the following piece of code, I point on the polygon
> Node of the SVG which is the symbol element (=> no ID =>
> NullPointerException). I want to get the use element (top, bottom or
> middle of the SVG)

   One thing to watch for is that the element it points at will be
in a 'shadow tree' (a copy we make so we can properly perform the
CSS cascade).  So you need to do some fancy footwork to navigate across
the symbol->use boundary (see batik.dom.svg.SVGOMUseShadowRoot.getCSSParentNode).

This mail has originated outside your organization, either from an external partner or the Global Internet.

Keep this in mind if you answer this message.

The information in this e-mail is confidential. The contents may not be disclosed or used by anyone other than the addressee. Access to this e-mail by anyone else is unauthorised.
If you are not the intended recipient, please notify Airbus immediately and delete this e-mail.
Airbus cannot accept any responsibility for the accuracy or completeness of this e-mail as it has been sent over public networks. If you have any concerns over the content of this message or its Accuracy or Integrity, please contact Airbus immediately.
All outgoing e-mails from Airbus are checked using regularly updated virus scanning software but you should take whatever measures you deem to be appropriate to ensure that this message and any attachments are virus free.