jQuery SVG vs Raphael
Je suis en train de travailler sur une interface interactive à l'aide de SVG et JavaScript/jQuery, et je suis en train de décider entre Raphaël et jQuery SVG. Je voudrais savoir
- Ce que les compromis entre les deux
- Où la dynamique de développement semble être.
Je n'ai pas besoin de la VML/IE soutien de Raphaël, ou le tracé des capacités de jQuery SVG. Je suis principalement intéressé par la façon la plus élégante de créer, d'animer, et de manipuler des éléments individuels sur une SVG toile.
- Qui semble comme quelque chose qui devrait être transformé en une nouvelle question, plutôt que d'un commentaire. 🙂
- Oui, c'est lié; créer un lien vers cette question si vous le souhaitez. Mais les commentaires sont des commentaires. Merci de respecter l'intention de l'utilisation du site, et de créer une nouvelle question. Vous obtiendrez de meilleurs résultats, et il aidera les autres à la recherche de la même réponse.
- oh viens. c'est ridicule. quelle partie de cette demande d'avis? "quels sont les compromis", on peut aisément répondre objectivement. "quel est l'élan" aussi l'objectif. c'est une bonne question, arrêtez d'être SI nazis.
- est correcte. semble comme SI il a perdu de son accent, que d'aider les utilisateurs à répondre à des questions, et il est devenu enragé dans sa juger de ce que l'opinion de moyens
Vous devez vous connecter pour publier un commentaire.
J'ai récemment utilisé à la fois Raphael et jQuery SVG - et voici mes réflexions:
Raphaël
Pour: une bonne base de départ de la bibliothèque, facile à faire BEAUCOUP de choses avec SVG rapidement. Bien écrit et documenté. Beaucoup d'exemples et de Démonstrations. Très extensible architecture. Grande animation.
Contre: est une couche sur le réel SVG balisage, il est difficile de faire des choses plus complexes avec SVG, tels que le groupement (il prend en charge les Ensembles, mais pas de groupes). Ne pas faire de grandes w/modifier des éléments existants.
jQuery SVG
Pour: un plugin jquery, si vous êtes déjà à l'aide de jQuery. Bien écrit et documenté. Beaucoup d'exemples et de démonstrations. Prend en charge la plupart des éléments SVG, permet un accès natif à des éléments facilement
Contre: architecture pas aussi extensible que Raphaël. Certaines choses pourraient être mieux documenté (comme le configurer de l'élément SVG). Ne pas faire de grandes w/modifier des éléments existants. S'appuie sur SVG sémantique pour l'animation - qui n'est pas énorme.
SnapSVG comme un pur la version SVG de Raphaël
SnapSVG est le successeur de Raphaël. Il est pris en charge uniquement dans le SVG navigateurs compatibles et prend en charge presque toutes les fonctionnalités de SVG.
Conclusion
Si vous êtes en train de faire quelque chose de rapide et facile, Raphaël est un choix facile. Si vous allez faire quelque chose de plus complexe, j'ai choisi d'utiliser jQuery SVG parce que je peux manipuler la majoration réelle beaucoup plus facile que celle de Raphaël. Et si vous voulez un non-jQuery solution, alors SnapSVG est une bonne option.
snapSVG
plugin? je viens de voir quelque article...Pour la postérité, je tiens à noter que j'ai fini par choisir Raphaël, parce que le propre de l'API et de la "liberté" d'IE de soutien, et aussi parce que le active de développement a l'air prometteur (manifestation de soutien vient d'être ajouté à 0.7, par exemple). Cependant, je vais laisser la question sans réponse, et je serais toujours intéressé à entendre parler de l'expérience des autres à l'aide de Javascript + SVG bibliothèques.
Je suis un grand fan de Raphaël et de la dynamique de développement semble être fort (version 0.85 a été publié à la fin de la semaine dernière). Un autre gros plus, c'est que son développeur, Dmitry Baranovskiy, est actuellement en train de travailler sur un Raphaël cartographie plugin, g.raphaël, qui ressemble à son promet d'être assez lisse (il y a quelques échantillons de la sortie des premières versions sur Flickr).
Cependant, il suffit de jeter un autre rival possible dans le SVG bibliothèque mélange, Google SVG Web semble très prometteur en effet (même si je ne suis pas un grand fan de Flash, qui l'utilise pour se rendre dans la non-conformes SVG navigateurs). Probablement l'un à regarder, surtout à l'approche des SVG Ouvrir conférence.
Raphaël est certainement plus facile à configurer et à y aller, mais notez qu'il existe des façons d'exprimer les choses en SVG qui ne sont pas possibles dans Raphaël. Comme indiqué ci-dessus il n'y a pas de "groupes". Cela implique que vous ne pouvez pas mettre en œuvre des couches de Coordonner les Transfomations. Au lieu de cela il y a seulement une transformation des coordonnées disponibles.
Si votre conception dépend imbriquée coordonner transforme, Raphaël n'est pas pour vous.
Oh Raphaël a évolué de manière significative depuis le mois de juin.
Il y a une nouvelle cartographie de la bibliothèque qui peut travailler avec elle et ils sont très accrocheur.
Raphaël prend en charge également l'SVG chemin de la syntaxe et de la prise en compte des avancés chemin de méthodes. Venez voir 1.2.8+ sur mon site (Shameless plug), puis rebondir sur le Dimitri du site à partir de là.
http://www.irunmywebsite.com/raphael/raphaelsource.html
Je pense qu'il n'est pas totalement sans rapport, mais avez-vous pensé de la toile? quelque chose comme Processus de JS peut la rendre plus simple.
Vous devriez aussi jeter un oeil à svgweb. Il utilise la technologie flash pour le rendu svg dans IE, et éventuellement sur d'autres navigateurs (dans le cas où il soutient de plus que le navigateur lui-même n').
http://code.google.com/p/svgweb/
Je vais jeter mon vote derrière Raphaël - la croix-prise en charge du navigateur, propre API et conforme des mises à jour (pour l'instant) de faire une joie à utiliser. Il joue très bien avec jQuery trop. Le traitement est cool, mais plus utile qu'une démo de saignement-bord de trucs en ce moment.
Javascript débutant, j'ai trouvé Raphael échantillons n'est pas si facile, je recommande http://cancerbero.mbarreneche.com/raphaeltut, qui est une véritable Étape par étape tutoriel.
Pour ceux qui ne se soucient pas IE6/IE7, le même gars qui a écrit Raphaël construit une svg moteur spécifiquement pour les navigateurs modernes: composant logiciel Enfichable.svg .. ils ont un très beau site avec de bonnes docs: http://snapsvg.io
composant logiciel enfichable.svg ne pouvait pas être plus facile à utiliser à la sortie de la boîte et peut manipuler/mettre à jour les SVGs ou en créer de nouveaux. Vous pouvez lire ce genre de choses sur le composant logiciel enfichable.io sur la page, mais voici une course rapide vers le bas:
Contre
Pros
Implémente toutes les fonctionnalités de SVG comme le masquage, l'écrêtage, les modèles, plein de dégradés, de groupes, et plus encore.
Capacité à travailler avec les SVGs: le contenu ne doit pas être généré avec le composant logiciel Enfichable pour qu'il fonctionne avec le composant logiciel Enfichable, vous permettant de créer du contenu commun des outils de conception.
Plein support de l'animation à l'aide d'un simple, facile à mettre en œuvre l'API JavaScript
Fonctionne avec des chaînes de SVGs (par exemple, les fichiers SVG chargé via Ajax) sans avoir à se rendre en fait d'abord, semblable à un conteneur de ressources ou de la feuille sprite.
de vérifier si vous êtes intéressés: http://snapsvg.io
Puisqu'il n'est pas mentionné ici encore:
Vous devriez aussi jeter un oeil à Dojox.dessin, qui offre une bonne SVG capacités de dessin. Il a un joli ensemble impressionnant de fonctionnalités. Je viens juste de commencer un projet avec elle, mais il me semble que c'est de loin supérieure (au moins en termes de fonctionnalités) à Raphaël et JQuerySVG.
Cette présentation qui m'a convaincu de l'utiliser à la place de Raphaël/JQuerySVG:
http://www.slideshare.net/elazutkin/dojo-gfx-svg-in-the-real-world-2114082
De référence:
http://dojotoolkit.org/reference-guide/dojox/index.html
De référence sur Dojocampus:
http://docs.dojocampus.org/dojox/drawing
Télécharger Dojo (y compris Dojox):
http://dojotoolkit.org/download/
Un autre svg librairie javascript que vous voudrez peut-être regarder à l'est d3.js. http://d3js.org/
Je préfère utiliser RaphaelJS car il a une grande croix-navigateur capacités. Cependant, certains SVG & VML effets ne peuvent pas être obtenus avec RaphaelJS (des gradients complexes...).
Google a également développé une bibliothèque de sa propre pour activer le support SVG c'est à dire:
http://svgweb.googlecode.com/files/svgweb-2009-08-20-B.zip
Si vous n'avez pas besoin de VML et IE8 support puis utiliser de la Toile (PaperJS par exemple). Regarder plus tard IE10 démos pour Windows 7. Ils ont d'incroyables animations dans la Toile. SVG n'est pas capable de faire quelque chose d'approchant.
D'ensemble de la Toile est disponible sur tous les navigateurs mobiles. SVG n'est pas de travail dans les premières versions d'Android 2.0 - 2.3 (que je sache)
Oui, la Toile n'est pas évolutive, mais tellement rapide que vous pouvez renouveler l'ensemble de la toile plus rapide que le navigateur capable de faire défiler la vue du port.
De mon point de vue de Microsoft optimisations fournit des moyens d'utiliser de la Toile en tant que régulière moteur GDI et mettre en œuvre des applications graphiques comme nous le faisons pour Windows maintenant.