SVG illustrator CC 2015

morea
Illustrator

Bonjour,
J'ai créé une illustration sur Illustrator CC 2015 et je souhaite l'enregistrer en svg pour pouvoir générer des événements sur chaque objet.
J'ai suivi la doc Illustrator en ligne mais c'est très sommaire. J'ai visité le forum d'Adobe mais c'est en anglais :-((. Je suis incapable d’expliquer mon problème en anglais, déjà que c’est pas simple en français !

Donc, j'ai trois calques avec des tracés très simples que j'ai nommés : ROND, POLYGONE et CARRE.
voici le script du SVG généré par Illustrator.

<svg id="CARRE" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 772.39 180.58">
  <title>essaiSVG</title>
  <rect x="294.81" width="159" height="159" fill="#ee00c2"/>
  <polygon points="746 158.29 654.61 180.58 589.61 112.58 616 22.29 707.39 0 772.39 68 746 158.29" fill="#7bff12"/>
  <circle cx="85" cy="85" r="85" fill="#3a00ec"/>
</svg>

Chaque calque devrait être converti en élément de groupe (<g>) avec comme « id » le nom du calque. Non ?
Pour pouvoir récupérer l’ « id » dans un script javascript que je lierai au SVG.

C’est mon premier SVG interactif et je suis totalement perdue. Quelqu’un peut-il m’aider ?
MERCI infiniment.
Maria

2 réponses

Syals

Petite précision, au cas où :
Si tu veux que tes sous-calque aient un id, dans illustrator il faut les renommer. De base, ils s'appellent genre < circle>, < eclipse>, et ne possèdent pas d'id, du coup, puisque c'est des noms génériques. Les renommer leur associe un id dans le code. Je crois cependant que c'est ce que tu as fait.

Donc, il est possible que tu ai exporté ton SVG en minimal, je t'ai fait un petit screen pour comprendre :
https://onedrive.live.com/redir?resid=4E1420A40FF4E9F!810&authkey=!APxMyt4JX09AdOw&v=3&ithint=photo%2cpng
(tu peux double cliquer dessus pour zoomer et utiliser la tite main pour déplacer, ou cliquer sur afficher l'originale)
Dans la petite fenêtre d'option sur illustrator, l'option "ID object" est à "nom de calque" pour le svg en haut (écran de gauche), et à "minimal" pour celui du bas. Tu peux constater qu'il enlève les id malgré le fait d'avoir renommé tes sous-calque. Regarde si tu l'a bien exporté en "nom de calque", voir.

(les groupes apparaissent avec enregistrer sous >> en svg)

morea
Auteur

Bonjour Syals et merci beaucoup pour ta réponse.
Je n'ai pas de sous-calque dans mon illustration et oui j'ai bien exporté en "nom de calque" et en fait je faisais pas "enregistrer-sous" mais "exporter" pour avoir accès au responsive.
Je viens de faire avec "enregistrer-sous" et du coup j'ai mes ID. Super !
Donc si je comprends bien, l'opération pour créer un événement pui ensuite enregistrer pour le web en responsive doit se faire en 2 temps, c'est ça ?
Je cherche désespérement un tuto/formation sur la dernière version d’illustrator CC 2015, qui traite du sujet et de préférence en français car en anglais je comprends pas tout, je ne trouve rien.
J’ai lu différents articles et celui de Michaël Chaize en particulier mais il date de 2013, les outils d’Illustrator ont évolué.
Voilà ! en tout cas merci pour ta réponse. Je vais essayer d'avancer.
Bonne journée.
Maria