D3: Algunas Técnicas para Incrementar la Interactividad de Gráficas

Posted on
techniques interactivity datavisualization

En este artículo, consideraremos varias técnicas sobre cómo hacer que un gráfico de líneas ordinario sea más informativo e interactivo utilizando una biblioteca de JavaScript para la visualización de datos D3.js.

Tomaremos los datos originales del centro de datos abiertos de Rusia y visualizaremos la dinámica de las tasas de interés promedio ponderadas en créditos otorgados a empresas e individuos entre las regiones del distrito Federal Central de Rusia.

Trataré de comentar las partes más importantes del código. Sin embargo, para una persona que no está familiarizada con los conceptos básicos de esta biblioteca (como selección, escala, transformación, zoom, patrón de actualización), muchas cosas pueden no parecer obvias. Usaremos la última quinta versión de la biblioteca D3.js y escribiremos código usando la sintaxis moderna de ES6. Si necesita transferir algunas partes del código a su propio proyecto, trabajando en un entorno que no admite ninguna de las características de ES6, no olvide usar el traductor de código.

Traducción Automática

Resultado Final

Fuentes