Home

D3 (Documentos controlados por Datos o *D3.js) por sus siglas en Inglés (Data-Driven Documents or D3.js) es una biblioteca de JavaScript para visualizar datos utilizando estándares web. D3 te ayuda a dar vida a los datos usando SVG, Canvas y HTML. D3 combina poderosas técnicas de visualización e interacción con un enfoque basado en datos para la manipulación de DOM, que le brinda todas las capacidades de los navegadores modernos y la libertad de diseñar la interfaz visual correcta para sus datos.

Recursos

• Introducción
• Referencia API
• Release Notes
• Galeria
• Ejemplos
• Tutoriales
• Complementos
• d3.js en Stack Overflow
• d3-js Grupo de Google Plus
• d3-js Canal de Slack (Invite)
• d3-js Chat en Gitter
• d3-js Canal IRC #d3.js en irc.freenode.net

Traducciones (No oficiales)

• English
• Español
• 한국어
• 日本語
• 中文手册
• 中文手册v4
• 简体中文
• 繁體中文
• Русский
• Türkçe
• Indonesian
• Português

Instalando

Si usa NPM, npm install d3. De lo contrario, descargue la Ultima versión. El paquete liberado es compatible con entornos AMD, CommonJS y vanilla. Cree un paquete personalizado utilizando Rollup o su paquete preferido. También puede cargar directamente desde d3js.org:

<script src="https://d3js.org/d3.v4.js"></script>

Para la versión minificada:

<script src="https://d3js.org/d3.v4.min.js"></script>

También puede usar las micro bibliotecas de D3 independientes. Por ejemplo, d3-selection:

<script src="https://d3js.org/d3-selection.v1.min.js"></script>

Si prefiere anclar a un lanzamiento específico, intente con CDNJS o unpkg.

Entornos compatibles

D3 es compatible con navegadores "modernos", lo que generalmente significa todo excepto IE8 y versiones anteriores. D3 está probado contra Firefox, Chrome, Safari, Opera, IE9 +, Android y también iOS. Partes de D3 pueden funcionar en navegadores más antiguos, ya que la biblioteca central D3 tiene requisitos mínimos: JavaScript y la API W3C DOM. D3 usa el Selectors API Nivel 1, pero puede precargar Sizzle para compatibilidad. Necesitará un navegador moderno para usar SVG y CSS3 Transitions D3 no es una capa de compatibilidad, por lo que si su navegador no admite estándares, no tiene suerte. ¡Lo sentimos!

D3 también se ejecuta en Node y web workers. Para usar DOM en Node, debe proporcionar su propia implementación de DOM; Se recomienda JSDOM. Para evitar la definición de un 'documento' global, pase un elemento DOM a d3.select o una NodeList a d3.selectAll, así:

var d3 = require("d3"),
    jsdom = require("jsdom");

var document = jsdom.jsdom(),
    svg = d3.select(document.body).append("svg");

Al usar D3 en un entorno que admite Módulos ES, puede importar el paquete D3 predeterminado como espacio de nombres:

import * as d3 from "d3";

Si desea importar un módulo D3 que no está incluido en el paquete predeterminado, debe asignarle un espacio de nombres separado:

import * as d3 from "d3";
import * as d3GeoProjection from "d3-geo-projection";

Por esta razón, el patrón preferido es importar símbolos de los Módulos D3 directamente, en lugar de usar el paquete predeterminado:

import {select, selectAll} from "d3-selection";
import {geoPath} from "d3-geo";
import {geoPatterson} from "d3-geo-projection";

Si está utilizando un paquete, asegúrese de que su paquete esté configurado para consumir el punto de entrada modules en el paquete.json. Consulte la página web Resolver mainFields, por ejemplo.

Desarrollo local (Test local)

Los navegadores imponen estrictos permisos de seguridad para evitar que lea archivos del sistema de archivos local. Para desarrollar localmente, debe ejecutar un servidor web local en lugar de usar file: // ..... Se recomienda node http-server. Instalar:

npm install -g http-server o sudo npm install --global http-server

Para ejecutar:

http-server

Esto iniciará el servidor en http://localhost:8080 del directorio donde este trabajando.