You are viewing a plain text version of this content. The canonical link for it is here.
Posted to batik-users@xmlgraphics.apache.org by Habib <ho...@gmail.com> on 2009/09/03 22:03:37 UTC
onClick event problem
Hi all,
i have an SVG file (generated by Graphviz) to which I want to script using
Java in order to add some event handling. The file is practically a set of
<g> elements which correspond to a text inside a box:
<g id="node1" class="node">
<title>node1</title>
<polygon fill="none" stroke="black" points="343,-684 197,-684 197,-648
343,-648 343,-684"/>
<text text-anchor="middle" x="270" y="-661.9" font-family="Times
Roman,serif" font-size="14.00">node1 label</text>
</g>
However, my problem is that I am adding event listener for an onClick action
on either the <g> or the <polygon> element (by srcipting with java). In
either way, the event is triggered only if I click on the text (i.e. when
the mouse pointer changes to a cursor) and not when I click on the box. Am I
missing something? Thank you.
Habib
Re: onClick event problem
Posted by Habib <ho...@gmail.com>.
Thank you Jonathan for you answer, but add point-events="none" to the text
element makes the whole box unresponsive to events. In case someone may spot
a problem, this is the code I use to add events:
NodeList nodeList = document.getElementsByTagName("g");
for (int i = 0; i < nodeList.getLength(); i++) {
Node n = nodeList.item(i);
String id = n.getAttributes().getNamedItem("id").getNodeValue();
if (id.startsWith("node")) {
Element elt = document.getElementById(id);
EventTarget t = (EventTarget) elt;
t.addEventListener("click", new OnClickAction(), false);
}
Habib
On Fri, Sep 4, 2009 at 12:02 AM, jonathan wood
<jo...@gmail.com>wrote:
> Hi Habib,
>
> Just a shot in the dark, but maybe the text bbox is maskin the
> others....try adding pointer-events="none" to the text node and see if your
> events get bubbled as expected...
>
> also see http://www.w3.org/TR/SVG/interact.html#PointerEventsProperty
>
> If this is no help, just shout back to me or the list. I'm new here also,
> so you may get better remedies later!
>
> jonathan
>
>
>
> On Thu, Sep 3, 2009 at 4:03 PM, Habib <ho...@gmail.com> wrote:
>
>> Hi all,
>>
>> i have an SVG file (generated by Graphviz) to which I want to script using
>> Java in order to add some event handling. The file is practically a set of
>> <g> elements which correspond to a text inside a box:
>>
>> <g id="node1" class="node">
>> <title>node1</title>
>> <polygon fill="none" stroke="black" points="343,-684 197,-684 197,-648
>> 343,-648 343,-684"/>
>> <text text-anchor="middle" x="270" y="-661.9" font-family="Times
>> Roman,serif" font-size="14.00">node1 label</text>
>> </g>
>>
>> However, my problem is that I am adding event listener for an onClick
>> action on either the <g> or the <polygon> element (by srcipting with java).
>> In either way, the event is triggered only if I click on the text (i.e. when
>> the mouse pointer changes to a cursor) and not when I click on the box. Am I
>> missing something? Thank you.
>>
>> Habib
>>
>>
>
Re: onClick event problem
Posted by jonathan wood <jo...@gmail.com>.
Hi Habib,
Just a shot in the dark, but maybe the text bbox is maskin the
others....try adding pointer-events="none" to the text node and see if your
events get bubbled as expected...
also see http://www.w3.org/TR/SVG/interact.html#PointerEventsProperty
If this is no help, just shout back to me or the list. I'm new here also,
so you may get better remedies later!
jonathan
On Thu, Sep 3, 2009 at 4:03 PM, Habib <ho...@gmail.com> wrote:
> Hi all,
>
> i have an SVG file (generated by Graphviz) to which I want to script using
> Java in order to add some event handling. The file is practically a set of
> <g> elements which correspond to a text inside a box:
>
> <g id="node1" class="node">
> <title>node1</title>
> <polygon fill="none" stroke="black" points="343,-684 197,-684 197,-648
> 343,-648 343,-684"/>
> <text text-anchor="middle" x="270" y="-661.9" font-family="Times
> Roman,serif" font-size="14.00">node1 label</text>
> </g>
>
> However, my problem is that I am adding event listener for an onClick
> action on either the <g> or the <polygon> element (by srcipting with java).
> In either way, the event is triggered only if I click on the text (i.e. when
> the mouse pointer changes to a cursor) and not when I click on the box. Am I
> missing something? Thank you.
>
> Habib
>
>
Re: onClick event problem
Posted by Habib <ho...@gmail.com>.
Thomas you were right on. The event is triggered when I click on the (thin)
border of the box, and pointer-events="all" does solve the problem. I'll
check more about these pointer-events. Thanks.
Habib
On Fri, Sep 4, 2009 at 1:58 PM, <th...@kodak.com> wrote:
>
> Hi Habib, Jonathan,
>
> Habib <ho...@gmail.com> wrote on 09/03/2009 04:03:37 PM:
>
> > i have an SVG file (generated by Graphviz) to which I want to script
> >
> > <g id="node1" class="node">
> > <title>node1</title>
> > <polygon fill="none" stroke="black" points="343,-684 197,-684
> > 197,-648 343,-648 343,-684"/>
> > <text text-anchor="middle" x="270" y="-661.9" font-family="Times
> > Roman,serif" font-size="14.00">node1 label</text>
> > </g>
>
> Note that the polygon has 'fill="none"'.
>
> > In either way, the event is triggered only if
> > I click on the text (i.e. when the mouse pointer changes to a
> > cursor) and not when I click on the box.
>
> Actually the event will be triggered if you click on the box,
> meaning the outline of the box. It won't be triggered over the
> 'fill' region, since there isn't any fill. Fortunately you can
> use the 'pointer-events' property to make it sensitive even
> when there isn't any fill:
>
> pointer-events="all"
>
> You might want to read up on pointer-events to see what
> other values might be useful to you.
>
Re: onClick event problem
Posted by th...@kodak.com.
Hi Habib, Jonathan,
Habib <ho...@gmail.com> wrote on 09/03/2009 04:03:37 PM:
> i have an SVG file (generated by Graphviz) to which I want to script
>
> <g id="node1" class="node">
> <title>node1</title>
> <polygon fill="none" stroke="black" points="343,-684 197,-684
> 197,-648 343,-648 343,-684"/>
> <text text-anchor="middle" x="270" y="-661.9" font-family="Times
> Roman,serif" font-size="14.00">node1 label</text>
> </g>
Note that the polygon has 'fill="none"'.
> In either way, the event is triggered only if
> I click on the text (i.e. when the mouse pointer changes to a
> cursor) and not when I click on the box.
Actually the event will be triggered if you click on the box,
meaning the outline of the box. It won't be triggered over the
'fill' region, since there isn't any fill. Fortunately you can
use the 'pointer-events' property to make it sensitive even
when there isn't any fill:
pointer-events="all"
You might want to read up on pointer-events to see what
other values might be useful to you.