D3 para impacientes

Capítulo 2. ¡Hagamos ya algunos gráficos!

Este trabajo se ha traducido utilizando IA. Agradecemos tus opiniones y comentarios: [e-mail]

Vamos a trabajar con algunos ejemplos que demostrarán algunas de las capacidades de D3, y te permitirán empezar a resolver algunos problemas del mundo real inmediatamente, aunque sólo sea adaptando los ejemplos. Los dos primeros ejemplos de este capítulo te mostrarán cómo crear gráficos estándar de dispersión y xy, completos con ejes, a partir de archivos de datos. Los gráficos no serán bonitos, pero serán totalmente funcionales, y debería ser fácil mejorar su aspecto y aplicar los conceptos a otros conjuntos de datos. El tercer ejemplo es menos completo. Es sobre todo una demostración para convencerte de lo fácil que es incluir el manejo de eventos y la animación en tus documentos.

Un primer ejemplo: Un único conjunto de datos

Para comenzar nuestra exploración de D3, considera el pequeño y sencillo conjunto de datos del Ejemplo 2-1. Trazar este sencillo conjunto de datos utilizando D3 ya nos pondrá en contacto con muchos conceptos esenciales.

Ejemplo 2-1. Un conjunto de datos simple (ejemplos-simple.tsv)

x	y
100	50
200	100
300	150
400	200
500	250

Como ya señalé en el Capítulo 1, D3 es una biblioteca JavaScript para manipular el árbol DOM con el fin de representar información visualmente. Esto sugiere que cualquier gráfico D3 tiene al menos dos o trespiezas móviles:

• Un archivo o documento HTML , que contiene un árbol ...