Quelle est la difference entre d3 et jQuery?

Question

en regardant cet exemple sur l'internet:

http://vallandingham.me/stepper_steps.html

il semble que les deux bibliothèques sont très similaires dans le sens où ils ont tous deux faire de manipulation du dom dans l'objet de chaînage.

Je suis curieux de savoir quelles fonctions d3 rend plus facile que jquery et vice-versa. Il y a beaucoup de graphiques et de visualisation des bibliothèques qui utilisent jquery (highcharts, flot, wijmo).

Veuillez donner des exemples précis de la façon dont ils sont différents.

Answer 1

D3 est centrée sur la création/manipulation de documents orientés données, qui est la création/manipulation de documents visuels à partir de vos données à l'aide de D3 de données/entrer/sortir des méthodes.

jQuery est d'un usage général, js/ajax bibliothèque qui offre générale js/ajax fonctionnalités pour la création d'applications web, mais il n'offre pas piloté par les données, des fonctionnalités de D3.

D3 a beaucoup de visualisation et d'extensions de jQuery a une multitude d'application web extensions.

Les deux sont de manipulation du dom bibliothèques js, ont sélecteurs css et api fluent et sont basées sur les standards du web, qui les fait se ressembler.

Answer 2

d3 a un drôle de description. jQuery et d3 ne sont pas tout à fait similaire, vous avez juste ne les utilisent pas pour les mêmes choses.

jQuery but est de faire des généraux de manipulation du dom. Il est d'un usage général, javascript boîte à outils pour tout ce que vous voulez faire.

d3 a été principalement conçu pour le rendre facile pour les rendre brillants graphiques avec des données. Vous devriez certainement utiliser (ou quelque chose de similaire, ou quelque chose de construit sur le dessus de celui-ci) si vous voulez faire des visualisations graphiques de données.

Si vous souhaitez un objectif général de bibliothèque JS pour tous vos formulaire interactif besoins, envisager jQuery ou proto ou mootools. Si vous voulez quelque chose d'infime, de considérer underscore.js. Si vous voulez quelque chose avec l'injection de dépendance et de testabilité, envisager d'AngularJS.

Une comparaison Générale guide de wikipedia.

Je peux voir pourquoi quelqu'un pourrait penser qu'ils sont similaires. Ils utilisent un semblable sélecteur de la syntaxe -- $('SELECTOR'), et d3 est un outil extrêmement puissant pour la sélection, filtrage et d'exploitation sur des éléments html, en particulier alors que le chaînage de ces opérations simultanément. d3 essaie d'expliquer cela sur sa page d'accueil, en prétendant être un objectif général de la bibliothèque, mais le fait est que la plupart des gens utilisent quand ils veulent faire des graphiques. Il est assez rare de l'utiliser pour votre moyen de manipulation du dom, parce que le d3 de la courbe d'apprentissage est raide. Il est, cependant, un outil plus général que celui de jQuery, et généralement, les gens construire d'autres plus spécifiques des bibliothèques (tels que nvd3) sur le dessus de d3 plutôt que de l'utiliser directement.

@JohnS réponse est également très bon. API Fluent = chaînage de méthode. Je suis également d'accord sur l'endroit où les plug-ins d'extension et de vous conduire avec les bibliothèques.

Answer 3

J'ai été en utilisant un peu les deux ces derniers temps. Depuis d3 utilise le Grésillement de sélecteurs, vous pouvez très bien mélanger les sélecteurs.

Il suffit de garder à l'esprit d3.select('#mydiv') ne retourne pas tout à fait la même que jQuery('#mydiv'). C'est le même élément du DOM, mais c'est instanciée avec différents constructeurs. Par exemple, disons que vous avez les éléments suivants:

<div id="mydiv" rel="awesome div" data-hash="654687867asaj"/>

Et prenons quelques méthodes:

> d3.select('#mydiv').attr('rel') ;
 "awesome div"

> jQuery('#mydiv').attr('rel');
 "awesome div"

Semble légitime. Mais si vous allez un peu plus loin:

> d3.select('#mydiv').data();
 [undefined]

> jQuery('#mydiv').data();
 Object {hash: "654687867asaj"}

Answer 4

d3 est conçu pour la visualisation de données. Pour ce faire, il filtre à travers des objets DOM et applique des transformations.

jQuery est conçu pour la manipulation du DOM et simplifie la vie de nombreuses tâches JS de base.

Si vous cherchez à transformer des données en jolies images interactives, D3 est génial.

Si vous souhaitez déplacer, manipuler ou modifier votre page Web, jQuery est votre outil.

Answer 5

Bonne question!

Bien que les deux bibliothèques partagent bon nombre des mêmes fonctionnalités, il me semble que la plus grande différence entre jQuery et D3 est le focus.

jQuery est une bibliothèque polyvalente qui vise à être multi-navigateur et facile à utiliser.

D3 se concentre sur les données (manipulation et visualisation) et ne prend en charge que les navigateurs modernes. Et bien que cela ressemble à jQuery, il est beaucoup plus difficile à utiliser.