G2

Inglés | 简体中文

G2

G2 es una gramática de visualización para la construcción del tablero, exploración de datos y narración de historias.

G2 lleva el nombre del libro de Leland Wilkinson The Grammar of Graphics y se inspiró profundamente en él desde el principio. Aquí hay algunos recursos con los que puede comenzar:

• Introducción: una breve descripción y las motivaciones del G2
• Ejemplos: una gran cantidad de demostraciones para aprender y copiar pasta
• Tutoriales: guías interactivas impulsadas por casos de conceptos centrales de G2
• Referencia de API: documentación completa para todos los componentes de visualización
• Editor: una herramienta de generación inteligente basada en ANTV. Utiliza IA para reducir el costo de desarrollo de la visualización de datos y puede generar rápidamente gráficos visuales a través del lenguaje natural.

Características

• Uso progresivo : el objetivo principal de G2 es ayudarlo a obtener visualizaciones significativas rápidamente con declaraciones concisas e infiere el resto. Pero puede configurar mucho más para situaciones complejas y avanzadas.
• API declarativa : emplea una API declarativa funcional para especificar opciones de gráficos de manera programática, lo que contribuye a una mejor reutilización lógica y una organización de código más flexible.
• Alta extensibilidad : para satisfacer necesidades específicas, G2 proporciona un mecanismo conveniente y consistente para extender todo lo que pueda imaginar, ya sea una escala, una transformación, una marca, etc. Incluso puede personalizar una nueva herramienta de visualización basada en este mecanismo.
• Gramática integral : G2 rechaza una tipología de la tabla a favor de marcas, transformaciones, escalas, coordenadas y composiciones. Además de las representaciones visuales estáticas, es posible declarar animaciones basadas en datos y aplicar interacciones bien diseñadas basadas en la acción también en las parcelas.
• Representador potente : hay un poderoso renderizador G bajo G2 para generar visualizaciones basadas en la web utilizando lienzo, SVG o WebGL. El montón de complementos que ha beneficiado a G2 de la representación de gráficos con estilos novedosos como dibujados a mano y que abarca completamente el ecosistema de D3.

? Empezando

G2 generalmente se instala a través de un administrador de paquetes como NPM o hilo.

$ npm install @antv/g2

$ yarn add @antv/g2

El objeto del gráfico se puede importar de G2.

 < div id =" container " > </ div > 

 import { Chart } from '@antv/g2' ;

// A tabular data to be visualized.
const data = [
  { genre : 'Sports' , sold : 275 } ,
  { genre : 'Strategy' , sold : 115 } ,
  { genre : 'Action' , sold : 120 } ,
  { genre : 'Shooter' , sold : 350 } ,
  { genre : 'Other' , sold : 150 } ,
] ;

// Instantiate a new chart.
const chart = new Chart ( {
  container : 'container' ,
} ) ;

// Specify visualization.
chart
  . interval ( ) // Create an interval mark and add it to the chart.
  . data ( data ) // Bind data for this mark.
  . encode ( 'x' , 'genre' ) // Assign genre column to x position channel.
  . encode ( 'y' , 'sold' ) // Assign sold column to y position channel.
  . encode ( 'color' , 'genre' ) ; // Assign genre column to color channel.

// Render visualization.
chart . render ( ) ;

Si todo va bien, ¡puedes obtener la siguiente hermosa tabla de bar!

? Ecosistema

• G2 -React: el componente React Ligero para G2, sin características adicionales.
• Extensiones G2: la ventanilla única para extensiones oficiales de G2, como visualización 3D, análisis visual automatizado, etc.
• CHARTS ANT-DESILLO: la biblioteca React Gráfica, basada en G2, G6, X6, L7Plot.
• Más...

? Que contribuye

• Problemas: informes de errores o características de solicitud
• Guía contribuyente: ayuda a construir G2
• Discusiones: discutir sobre GitHub o en Dingtalk Group (30233731, 35686967, 44788198)

? Licencia

Mit@antv.