丰富的图表类型

• 提供开箱即用的 20 多种图表和十几种组件，并且支持各种图表以及组件的任意组合；

强劲的渲染引擎

• Canvas、SVG 双引擎一键切换，增量渲染等技术实现千万级数据的流畅交互；

简单易容，上手容易

• 直接通过编写配置，便可以生成各种图表，并且支持多种集成方式；

活跃的社区

• 活跃的社区用户保证了项目的健康发展，也贡献了丰富的第三方插件满足不同场景的需求；

SVG介绍

• SVG 全称为（Scalable Vector Graphics），即可缩放矢量图形。
• SVG 是一种基于XML格式的矢量图，主要用于定义二维图形，支持交互和动画。
• SVG 规范是万维网联盟(W3C) 自 1998 年以来开发的标准。
• SVG 图像可在不损失质量的情况下按比例缩放，并支持压缩。
• 基于XML的SVG可轻松的用文本编辑器或矢量图形编辑器创建和编辑，并可以直接在浏览器显示。SVG

2D动画transform

常见的函数transform function有：

• 平移：translate(x, y)

• 缩放：scale(x, y)

• 旋转：rotate(deg) 在lineTo前使用

• 倾斜：skew(deg, deg)

• CSS 中的每个元素都有一个坐标系，其原点位于元素的左上角，左上角这被称为初始坐标系。

• 用transform时，坐标系的原点默认会移动到元素的中心(重点)。

• 因为transform-origin属性的默认值为50% 50%，即该原点将会作为变换元素的中心点。

• 用transform属性旋转或倾斜元素，会变换或倾斜元素的坐标系。并且该元素所有后续变换都将基于新坐标系的变换。

• 因此，transform属性中变换函数的顺序非常重要——不同的顺序会导致不同的变换结果。