Event clic avec DOM / batik : Récupération du use qui référence un symbole

Bonjour,

Je travaille actuellement sur une application graphique (manipulation d'un fichier SVG) en Java avec l'utilisation de batik DOM pour manipuler directement le document SVG.

Mes différents éléments sont déclarés dans des balises "symbol" et sont utilisés/affichés grâce aux balises "use".

Voici le document SVG :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27

<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" contentScriptType="text/ecmascript" width="100%" zoomAndPan="magnify" contentStyleType="text/css" height="100%" preserveAspectRatio="xMidYMid meet" version="1.0">   <defs> <g id="module-list"> <symbol preserveAspectRatio="xMidYMid meet" id="chaise_1.1.2" version="1.1.2" viewBox="0 0 200 256" module="chaine"> <polygon fill="inherit" clip-rule="evenodd" fill-rule="evenodd" points="184.055,256.09 184.055,256.09 184.055,148.195 199.135,148.195 199.135,256.09 "/> <polygon fill="inherit" clip-rule="evenodd" fill-rule="evenodd" points="83.006,201.214 83.006,201.214 83.006,187.532 182.656,187.532 182.656,201.214 "/> <polygon fill="inherit" clip-rule="evenodd" fill-rule="evenodd" points="83.006,169.963 83.006,169.963 83.006,149.286 182.656,149.286 182.656,169.963 "/> <path fill="inherit" clip-rule="evenodd" d="m94.664,133.266L94.664,133.266c8.183-2.792,23.189-5.077,45.008-6.836 c21.818-1.76,38.142-1.219,48.972,1.631c10.831,2.85,16.246,9.305,16.246,19.354H82.382 C82.382,140.779,86.473,136.071,94.664,133.266z" fill-rule="evenodd"/> <path fill="inherit" clip-rule="evenodd" d="m55.951,25.838c-5.393-15.133-5.964-23.633-1.714-25.497 c7.672-1.866,13.17,6.633,16.486,25.497c7.25,35.553,10.885,69.858,10.885,102.921v127.33H66.369l0.308-126.706 C66.677,96.004,63.104,61.497,55.951,25.838z" fill-rule="evenodd"/> </symbol> </g> </defs> <g id="plan-list"> <g id="nameZone1"> <rect fill="#000000" x="0" width="500" height="500" y="0"/> <use x="50" y="20" fill="#F5A9D0" width="20" xlink:href="#chaise_1.1.2" xlink:type="simple" xlink:actuate="onLoad" height="200" xlink:show="embed"/> <use x="50" y="60" width="20" xlink:href="#chaise_1.1.2" xlink:type="simple" xlink:actuate="onLoad" height="200" xlink:show="embed"/> </g> <g id="nameZone2"> <rect fill="#0000FF" x="500" width="500" height="500" y="0"/> <use x="550" y="20" width="20" xlink:href="#chaise_1.1.2" xlink:type="simple" xlink:actuate="onLoad" height="200" xlink:show="embed"/> <use x="550" y="60" width="20" xlink:href="#chaise_1.1.2" xlink:type="simple" xlink:actuate="onLoad" height="200" xlink:show="embed"/> </g> </g> </svg>

---

J'ajoute un évent sur un élément du SVG :

Code:

---

1 2	((EventTarget) objAdd.getNodeUse()).addEventListener( "mousedown", new EObject(), false); ((EventTarget) objAdd.getNodeDefs()).addEventListener( "mousedow", new EObject(), false);

---

La classe EObject implémente org.w3c.dom.events.EventListener :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

import org.w3c.dom.Element; import org.w3c.dom.events.Event;   public class EObject implements org.w3c.dom.events.EventListener { public void handleEvent(Event evt) { System.out.println("YOUPIIII JE SUIS CLIQUE"); Element e = (Element) evt.getTarget(); System.out.println(e.toString());   // Test de récupération de la balise use de l'élément sélectionné :   //SVGOMUseElement elem = (SVGOMUseElement)evt.getTarget(); //System.out.println("USE : " + elem.getNodeName());   if(e.getNodeName().compareTo("polygon") == 0 || e.getNodeName().compareTo("path") == 0) { e = ((Element)e.getParentNode()); }   System.out.println(((Element)e.getParentNode()).getClass()); } }

---

Je souhaiterais récupérer l'élément "use" correspondant à l'élément cliqué.

Cependant un simple :

Code:

---

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

---

récupère des composants de l'élément (polygon ou path).

Et lorsque je fais un :

Code:

---

e = ((Element)e.getParentNode());

---

j'obtiens l'élément "svg".

Des idées sont les bienvenues.

Je vous remercie d'avance pour votre aide précieuse.

Essaye avec getCurrentTarget() au lieu de getTarget().

Sinon, au lieu d'utiliser "mousedown" et de risquer d'écrire "mousedow", utilise SVGConstants.SVG_MOUSEDOWN_EVENT_TYPE

Bonjour,

Merci pour votre réponse.

Elle m'est bien utile car je voulais aussi récupérer la zone sélectionnée par l'utilisateur.

En effet getCurrentTarget() sur un object me renvois l'élément :

Code:

---

<g id="nameZone1">

---

Qui correspond à :

Code:

---

1 2 3 4 5 6

<g id="nameZone1"> <rect fill="#000000" x="0" width="500" height="500" y="0"/> <use x="50" y="20" fill="#F5A9D0" width="20" xlink:href="#chaise_1.1.2" xlink:type="simple" xlink:actuate="onLoad" height="200" xlink:show="embed"/> <use x="50" y="60" width="20" xlink:href="#chaise_1.1.2" xlink:type="simple" xlink:actuate="onLoad" height="200" xlink:show="embed"/> </g>

---

Cependant j'aimerais aussi récupérer le use sélectionné.. Auriez-vous une autre idée ?

Merci pour votre aide.



J'ai remarquer que les événements ajoutés comme je le fais :

Code:

---

1 2	((EventTarget) objAdd.getNodeUse()).addEventListener( SVGConstants.SVG_MOUSEDOWN_EVENT_TYPE, new EObject(), false); ((EventTarget) objAdd.getNodeDefs()).addEventListener( SVGConstants.SVG_MOUSEDOWN_EVENT_TYPE, new EObject(), false);

---

Ne semble pas avoir d'impact.

En effet, dans mon code je fais également un :

Code:

---

1 2 3

Element elt = doc.getElementById("nameZone1"); EventTarget t = (EventTarget)elt; t.addEventListener(SVGConstants.SVG_MOUSEDOWN_EVENT_TYPE, new EObject(), false);

---

(Et lorsque j'enlève le bout de code ci-dessus, un clique sur un élément n’engendre rien.)

C'est surement pour cela que getCurrentTarget() me renvois l'élément g correspondant.

Le problème doit certainement être l'ajout d'événement sur l'élément.

Encore une fois si vous avez une idée, elle est la bien venue..

S'il vous plais :(

Désolée d'insister mais je suis bloquée dans mon avancement et ne trouve pas de solutions...