2011-11-22 4 views
1

J'ai un cookie, appelé 'plan' qui contient une valeur de chaîne représentant un canevas RaphaelJS et quelques objets dedans comme SVG. Les chemins exacts etc peuvent varier, mais voici typlically ce qui est enregistré dans le cookie:Transmettre la chaîne SVG de cookie à RaphaelJS

<svg height="100%" version="1.1" width="100%" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative;"><desc>Created with Raphaël 2.0.1</desc><defs/><path style="" fill="none" stroke="#d9e026" d="M153,74L384,74L384,304L0,304L0,150L153,150L153,74"/><path style="" fill="#333333" stroke="#d9e026" d="M160,160L160,220L220,220A60,60,0,0,0,160,160" transform="matrix(1, 0, 0, 1, -103, 84)"/><rect x="121.53846153846155" y="158.5" width="76.92307692307692" height="3" r="0" rx="0" ry="0" fill="#333333" stroke="#d9e026" style="" transform="matrix(1, 0, 0, 1, -89, -9)"/><rect x="83.0769230769231" y="156" width="76.92307692307692" height="5" r="0" rx="0" ry="0" fill="#333333" stroke="#d9e026" style="" transform="matrix(0, -1, 1, 0, 223.038, 364.039)"/></svg> 

Maintenant, je dois être en mesure de transmettre ces données dans un nouvel objet raphaeljs sur une nouvelle page et ajouter quelques chemins etc dans il.

Quelqu'un peut-il suggérer comment faire cela alors que j'ai du mal à savoir par où commencer?

Merci!

Répondre

2

Theres une nouvelle fonction spiffing Raphael 2 qui simplifie ces tâches Paper.add

http://www.irunmywebsite.com/raphael/additionalhelp.php?v=2&q=paper.add

+0

Ah, merci Chasbeen. Il n'y a donc pas besoin d'utiliser cette bibliothèque du tout? Paper.add gérera toutes les facettes de la ré-instanciation d'une instance de Raphael (y compris les transformations, les rotations, etc.)? – Dan

+0

En fait, bien qu'il y ait une démo sur votre site de paper.add, je n'arrive pas à le voir dans la documentation officielle http://raphaeljs.com/2.0/. Est-il si nouveau (v2.0.1) qu'il n'est pas encore documenté? – Dan

+0

Dan Cliquez sur le lien Raphael à côté de Raphael.add La fonction Raphael.add a été ajoutée en 2.01 mais ces liens (Hors site à côté des démos) pointent toujours vers la dernière documentation ... – Chasbeen

0

En regardant cela de manière beaucoup plus détaillée, il s'avère que ce n'est pas si simple. Le code SVG n'est disponible que sur les nouveaux navigateurs (IE8 +), donc cette approche ne fonctionnera pas dans IE7 ou moins. Manifestement, l'objet Raphael stocke les données nécessaires pour pouvoir utiliser avant qu'il ne frappe le DOM. Il y a un plug-in très pratique que j'ai trouvé pour sérialiser les données de Raphael puis les désérialiser en sortie. Bien que j'ai quelques problèmes avec la partie de la désérialisation, en théorie, cela devrait être la solution: https://github.com/jspies/raphael.serialize.

Pour que le plug-in me permet essentiellement de faire ceci:

Raphael canvas > serialized JSON object > String > Cookie > String > serialized JSON object > Raphael canvas. 
+0

En fait, ce plug-in est un peu bogué dans raphael 2, mais il y a un projet de splinter qui le gère beaucoup mieux ici: https://github.com/ElbertF/Raphael.JSON – Dan

Questions connexes