Jquery / SVG : récupérer le nom des path#ID
Bonjour,
Je vous demande de l'aide pliz !
ça fait trois jours que je galère sur une problématique probablement liée à mon inexpérience en JS et je n'avance plus du tout.
J'aimerai me servir d'une carte interactive pour travailler la cohérence d'un monde science-fantasy.
Pour ça, j'ai créé une carte de ce monde au format SVG, ce qui me devait me permettre de manipuler chaque élément de cette carte.
En CSS tout va bien, mais en JS / Jquery, je n'y arrive pas.
Avant même de travailler sur les évènements historiques (en injectant des animations), j'ai commencé par un exercice que je croyais simple : dresser l'état du monde à une date précise.
Pour ça, je me suis inspiré de la worldmap intéractive suivante : http://codepen.io/antoniskamamis/pen/zglJE
La personne récupère tous les ID de ses "path" et les compare avec une base de données (officielle) sous format JSON.
A chaque fois qu'il "hover" un pays, un script est généré et récupère quelques infos de ce pays pour les mettre dans une div dynamique nommée "indicator".
J'ai essayé de reproduire ce script, d'abord en utilisant mon propre JSON, mais vu que je n'arrivais pas à l'appeler correctement, j'ai créé une variable "data" qui contient des informations sur chacun des pays que j'ai créé.
Ensuite, j'ai essayé de récupérer tous les ID de mon SVG et le problème coince là :
Code:
1
2
| var paysId = $('path').each(function () {
$(this).attr('id'); }); |
Cela me donne un tableau (ok) de valeur sous forme "path#paysn.pays.humain" (nok)
Bizarrement, si je tape :
Code:
var id = $('path#pays1').attr('id');
il me retourne bien le nom du pays ! @___@
J'aimerai récupérer le nom de ces ID ainsi : ["pays1", "pays2"..] et les "associer" avec les valeurs "nom_pays" contenues dans mon tableau DATA.
Ce qui doit me permettre in fine d'afficher les infos de chacun des pays dans ma DIV.indicator. (j'en suis pas encore là mais si vous avez une piste..?)
Voici un bout de ce code (j'ai 127 ID)
http://codepen.io/kasanabyl/pen/mPbYYN
Est ce que je m'y prends mal ? Quelqu'un peut il m'aiguiller ou me débloquer ?
