G2

Английский | 简体中文

G2

G2 - это грамматика визуализации для построения панели панели, исследования данных и рассказывания историй.

G2 назван в честь книги Леланда Уилкинсона «Грамматика графики» и была глубоко вдохновлена ​​ею в самом начале. Вот некоторые ресурсы, с которыми вы можете начать:

• Введение - краткий обзор и мотивы G2
• Примеры - большое количество демонстраций, которые нужно учиться и копировать вставку
• Учебные пособия - интерактивные корпусы
• Ссылка API - Полная документация для всех компонентов визуализации
• Редактор - Интеллектуальная инструмент генерации, основанный на ANTV. Он использует ИИ для снижения стоимости разработки данных визуализации данных и может быстро генерировать визуальные диаграммы с помощью естественного языка.

Функции

• Прогрессивное использование - Основная цель G2 - помочь вам быстро получить значимые визуализации с краткими объявлениями, а остальное - все время. Но вы можете настроить гораздо больше для сложных и передовых ситуаций.
• Declarative API - Мы используем функциональный декларативный API для указания опций диаграммы в программном виде, что способствует лучшему логическому повторному использованию и более гибкой организации кода.
• Высокая расширяемость - Для удовлетворения конкретных потребностей G2 обеспечивает удобный и последовательный механизм, чтобы расширить все, что вы можете себе представить, будь то масштаб, преобразование, отметка и т. Д. Вы даже можете настроить совершенно новый инструмент визуализации на основе этого механизма.
• Комплексная грамматика - G2 отвергает типологию диаграммы в пользу отметок, преобразований, масштабов, координат и композиций. В дополнение к статическим визуальным представлениям, можно объявить анимации, управляемые данными, и применить хорошо продуманные взаимодействия на основе действий для участков.
• Мощный рендеринг - в G2 есть мощный рендеринг G для генерации веб -визуализаций с использованием Canvas, SVG или WebGL. Множество плагинов, которые он имеет выгоду G2 от рендеринга диаграмм с новыми стилями, такими как нарисованные вручную и полностью охватывая экосистему D3.

? Начиная

G2 обычно устанавливается через диспетчер пакетов, такой как NPM или пряжа.

$ npm install @antv/g2

$ yarn add @antv/g2

Затем объект диаграммы может быть импортирован из 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 ( ) ;

Если все пойдет хорошо, вы можете получить следующую прекрасную барную карту!

? Экосистема

• G2 -React - легкий компонент React для G2, без дополнительных функций.
• G2-Extensions-универсальный магазин для официальных расширений G2, таких как 3D-визуализация, автоматическая визуальная аналитика и т. Д.
• Графики муравья-библиотека диаграммы, основанная на G2, G6, X6, L7plot.
• Более...

? Внося

• Проблемы - сообщать об ошибках или функциях запроса
• Руководство по внесению вклад - Помогите построить G2
• Обсуждения - Обсудите на GitHub или в группе Dingtalk (30233731, 35686967, 44788198)

? Лицензия

MIT@ANTV.