DC.js D3.js 简介
D3.js 是一个 JavaScript 库，用于在浏览器中创建交互式可视化。 D3 库允许我们在数据集的上下文中操作网页的元素。这些元素可以是 HTML、SVG 或 Canvas 元素，可以根据数据集的内容进行引入、移除或编辑。它是一个用于操作 DOM 对象的库。 D3.js 可以成为数据探索的宝贵帮助。它让您可以控制数据的表示形式，并让您添加数据交互性。
与其他库相比，D3.js 是最重要的框架之一。这是因为;它适用于网络和数据可视化，并且是企业级的。另一个原因是其极大的灵活性，它使世界各地的开发人员能够创建许多高级图表。此外，它还在很大程度上扩展了其功能。
让我们了解D3.js的基本概念，具体如下-
选择
数据连接
SVG
过渡
动画
D3.js API
让我们详细了解每个概念。
选择
选择是 D3.js 的核心概念之一。它基于 CSS 选择器概念。那些使用过并了解 JQuery 的人可以很容易地理解这些选择。它使我们能够基于 CSS 选择器选择 DOM，然后提供修改或附加和删除 DOM 元素的选项。
数据连接
数据连接是 D3.js 中的另一个重要概念。它与选择一起工作，使我们能够根据我们的数据集（一系列数值）操作 HTML 文档。默认情况下，D3.js 在其方法中赋予数据集最高优先级，数据集中的每一项都对应一个 HTML 元素。
SVG
SVG 代表
可缩放矢量图形。 SVG 是一种基于 XML 的矢量图形格式。它提供了绘制不同形状（例如直线、矩形、圆形、椭圆等）的选项。因此，使用 SVG 设计可视化可为您提供更多功能和灵活性。
转型
SVG 提供了转换单个 SVG 形状元素或一组 SVG 元素的选项。 SVG 转换支持平移、缩放、旋转和倾斜。
过渡
转换是一个项目从一种状态变为另一种状态的过程。 D3.js 提供了一个 transition() 方法来在 HTML 页面中执行过渡。
动画
D3.js 通过过渡支持动画。动画可以通过正确使用过渡来完成。过渡是关键帧动画的一种有限形式，只有两个关键帧：
start 和
end。起始关键帧通常是 DOM 的当前状态，结束关键帧是您指定的一组属性、样式和其他属性。转换非常适合转换到新视图，而无需依赖于起始视图的复杂代码。
D3.js API
让我们简要了解一些重要的 D3.js API 方法。
集合 API
集合只是一个将多个元素组合成一个单元的对象。它也被称为容器。它包含对象、地图、集合和嵌套。
路径 API
路径用于绘制矩形、圆、椭圆、折线、多边形、直线和曲线。 SVG 路径表示可以描边、填充、用作剪切路径或三者任意组合的形状的轮廓。
轴 API
D3.js 提供了绘制轴的函数。轴由线条、刻度和标签组成。一个轴使用刻度，因此每个轴都需要一个刻度才能使用。
缩放 API
缩放有助于缩放您的内容。您可以使用点击和拖动方法专注于特定区域。
分隔符分隔值 API
定界符是一个或多个字符的序列，用于指定纯文本或其他数据中单独的独立区域之间的边界。字段分隔符是一系列以逗号分隔的值。简而言之，分隔符分隔值是逗号分隔值 (CSV) 或制表符分隔值 (TSV)。
