Extraction des données de chemin à partir d'une carte SVG à utiliser dans RaphaelJs

Question

J'essaye de construire une carte interactive en utilisant RaphaelJS (par exemple http://raphaeljs.com/australia.html). S'il vous plaît vérifier la source. Il nécessite des données de chemin de carte à saisir. Il n'y a aucune explication claire sur la façon d'obtenir cette information, à part le fait qu'illustrator ou inkscape sont capables de le faire. Je cherche à obtenir des données de chemin "States" de cette carte de l'Inde: http://en.wikipedia.org/wiki/File:India-locator-map-blank.svg

Answer 1

bien, celui-ci est facile. SVG est juste un simple fichier XML. Vous n'avez donc pas à "extraire" quoi que ce soit via Illustrator.

Il suffit d'ouvrir le fichier SVG dans n'importe quel éditeur de texte et tout y est! (la chaîne de données de chemin que vous pouvez utiliser avec RaphaelJS path-function est conservée dans l'attribut d des nœuds de chemin).

Suivre notre pour les droits d'auteur lors de l'utilisation des fichiers SVG des autres;)

mouffettes

Answer 2

Pour SVG anciens fichiers les données de chemin devra être optimisé pour RaphaelJS. Ouvrez le fichier dans Inkspace et enregistrez-le en tant qu'AVG optimisé. Si vous avez un fichier AVG qui s'ouvre en tant qu'image vide dans Adobe Illustrator, modifiez le fichier avec un éditeur de texte et définissez les deux premières valeurs de viewBox à 0,0. Les deux étapes peuvent être nécessaires lorsque vous travaillez avec des fichiers map AVG de Wikipedia.

Answer 3

Vous pouvez également utiliser un convertisseur comme Ready.Set.Raphael pour extraire les chemins pour vous et créer la sortie javascript. C'est un gain de temps réel!