G2(可视化引擎)是一款专业且实用的可视化引擎软件。用户们通过G2(可视化引擎)软件可以将众多的复杂的数据可视化,具有高度的易用性和扩展性。可以让大家轻松实现图表的制作。系统城给大家提供了G2(可视化引擎)免费安装包下载,还有使用教程,喜欢的朋友可以来系统城下载。
G2功能介绍
1、健全的图形语法:数据到图形的映射,可以制作出全部的图表。
2、全新的交互语法:根据激发和反馈机制可以搭配出各种各样交互行为,对数据进行探寻。
3、强大的View控制模块:可支持开发个性化的数据多维分析图形。
4、双引擎渲染:Canvas或SVG随意转换。
5、可视化组件体系:面向交互、体验优雅。
6、全方位相拥TypeScript:提供详细的类型定义文档。
G2特色说明
1、图表示例
G2(可视化引擎)官方版千变万化,随意搭配
任何图表,都能够基于图形语法灵活制作,满足你无尽的创意。
2、专业完备
很多产品实践之上,提供制图引擎、完备图形语法、专业设计规范。
3、生动,可交互
强大的交互语法,助推可视分析,让图表惟妙惟肖。
4、精品Gallery
真正的数据可视化案例,我们将他们归纳为一个个故事性的设计模板,让用户做到开箱即用的效果。
G2使用教程
通过 npm 安装
npm install @antv/g2 --save
成功安装完成之后,即可使用 import 或 require 进行引用。
浏览器引入
既可以通过将脚本下载到本地也可以直接引入在线资源
开始使用
在 G2 引入页面后,我们就已经做好了创建第一个图表的准备了。
下面是以一个基础的柱状图为例开始我们的第一个图表创建。
1、创建 div 图表容器
在绘图前我们需要为 G2 准备一个 DOM 容器。
2.、编写图表绘制代码
创建 div 容器后,我们就可以进行简单的图表绘制:
1、new Chart() 创建 Chart 图表对象,指定图表所在的容器 id、图表的宽高、边距等信息;
2、chart.data() 载入图表数据源;
3、使用图形语法进行图表的绘制;
4、chart.render() 渲染图表。
更新说明
typings: 增强类型声明
scrollbar: 滚动条增加一个滚道激活样式配置
legend: legend 增加 checked 单选交互
animation: 动画添加重复执行参数
life-circle: view 生命周期事件触发,携带事件内容