web-dev-qa-db-fra.com

Prise en charge du navigateur D3.JS

Un développeur ayant une expérience de D3.JS pourrait-il indiquer quels navigateurs et niveaux de version de navigateur spécifiques prennent en charge le plus facilement la bibliothèque D3.JS?

Existe-t-il une liste de "composants" D3.JS connus pour ne pas être compatibles avec des navigateurs et des niveaux de version de navigateur spécifiques?

Le site Internet D3.JS propose:

Prise en charge du navigateur

D3 prend en charge les navigateurs dits "modernes", ce qui signifie généralement tout sauf IE8 et inférieur. D3 est testé contre Firefox, Chrome (Chromium), Safari (WebKit), Opera et IE9. Certaines parties de D3 peuvent fonctionner dans des navigateurs plus anciens, comme noyau La bibliothèque D3 a des exigences minimales: JavaScript et l'API DOM W3C. Pour IE8, la bibliothèque de compatibilité Aight est recommandée. D3 utilise l'API Selectors niveau 1, mais vous pouvez précharger Sizzle pour la compatibilité. Vous aurez besoin d'un navigateur moderne pour utiliser SVG et Transitions CSS3. D3 n'est pas une couche de compatibilité, donc si votre navigateur ne prend pas en charge les normes, vous n'avez pas de chance. Désolé! "

Cependant, j'espérais une réponse plus précise.

39
user1836288

Je vais m'exprimer ici et assimiler le support SVG au support D3, car (à mon avis) c'est la partie la plus utile de la bibliothèque.

Dans cet esprit, ce lien devrait vous donner les versions exactes du navigateur qui le prennent en charge: http://caniuse.com/svg

Et cela correspond à ce que vous avez collé sur le site D3: essentiellement tous les principaux fournisseurs de navigateurs, sauf IE a pris en charge SVG pour de nombreuses versions.

Votre question dit "en pratique" et cela signifie SVG. Oui, je sais qu'il existe des exemples d'utilisation de D3 avec les parties non SVG du DOM, mais la grande majorité des exemples dans galerie sont basés sur SVG.

25
explunit

D3 est une bibliothèque pour les manipulations de données avec de nombreux outils d'aide pour les visualisations de données en utilisant SVG et Canvas.

D3 est conçu pour vous donner un accès direct à toutes les fonctionnalités sous-jacentes de HTML et SVG. Cela signifie que la compatibilité entre les navigateurs est limitée par les éléments et les attributs que votre code utilise plutôt que D3 lui-même.

Voici quelques exemples pour HTML5 et CSS :

// Requires HTML5
d3.select('body').append('nav');

// Requires CSS3 transformations
d3.select('div').style('transform', 'matrix(1, -0.3, 0, 1, 0, 0)');

et un pour SVG et SMIL :

// Requires SMIL
d3.select('rect').append('animate')
   .attr('attributeName', 'x')
   .attr('from', 10)
   .attr('to', 50);

et un pour Canvas :

// Requires Canvas
d3.select('body').append('canvas');

Si nous considérons uniquement le framework D3 lui-même (par exemple pour utiliser uniquement les fonctions de géo projection, mais pas d'éléments DOM, etc.), la compatibilité entre les navigateurs est limitée par la prise en charge du navigateur de ECMAScript 5 en raison de la utilisation intensive de map, forEach, etc.

6
Christoph Körner