Créer des événements JS sur un SVG

Bonjour,

Je cherche désespérément un exemple pour pouvoir interagir avec du jQuery sur un svg.
J'ai une carte avec des régions en SVG, je souhaiterai pouvoir cibler des régions et y ajouter un évènement dessus comme un onmouseover ou un click.

Actuellement, j'ai inclus mon fichier svg, via une balise object :

 <object type="image/svg+xml" data="carte-europe.svg" width="100%" height="100%">
                Votre navigateur ne peut afficher la carte.
            </object>

Peut être qu'il faut l'inclure différemment ? J'aimerai éviter de modifier le code du fichier svg si possible...

Merci pour votre aide.

Salut, regarde du coté de raphael JS : http://raphaeljs.com

Il est très bon pour créer et exploiter les svg. Tu pourras alors ajouter une couche event sur ta carte pour faire ce que tu y veux.

Un exemple : http://jsfiddle.net/xzen/Qt22a/2/

Tu as la doc ici : http://raphaeljs.com/reference.html

tu as un exemple de carte ici : http://raphaeljs.com/australia.html

Bonne soirée.

Xzen.

Salut ! Merci pour ta réponse, je suis tombé sur la lib Raphael en cherchant pour trouver une solution à mon problème mais c'est pas exactement ce que je cherche
Raphael, permet de créer du svg, à partir de code JS et moi je souhaiterai l'inverse, cad manipuler avec du JS/CSS un svg déjà existant (généré depuis illustrator).


Je vous partage un article qui m'a aidé à trouver la solution (en anglais) :

http://tympanus.net/codrops/2013/02/06/interactive-infographic-with-svg-and-css-animations/
Modifié par Gyzm0 (11 Mar 2013 - 16:56)

Salut,

Je pense que Raphael JS reste la meilleur solution même avec ton exemple.

Pour convertir automatiquement un fichier svg vers Raphael js utilise ce lien : http://www.readysetraphael.com/

Cdt, Xzen.