D3.js 介绍

D3是Data-Driven Documents的缩写，D3.js是一个基于数据管理文档的资源JavaScript库。 D3 是最有效的数据可视化框架之一。它允许开发人员在 HTML、CSS 和 SVG 的帮助下在浏览器中创建动态的交互式数据可视化。数据可视化是将过滤后的数据以图片和图形的形式表现出来。图形或图形表示可以轻松呈现复杂的数据集。此外，可以借助数据可视化轻松跟踪比较分析或模式，从而使客户能够在没有太多头脑风暴的情况下做出决策。使用 D3.js 等框架可以轻松开发此类可视化。 Mike Bostock 编写了 D3 框架。在 D3 之前，Protovis 工具包被广泛用于数据可视化。尽管还有许多其他数据可视化框架，但 D3.js 因其灵活性和可学习性而留下了自己的足迹。

设置 D3.js 环境：

步骤1：为了将D3.js用于网站或网页，首先需要注意的是它的安装或将库导入网页。 D3 是一个开源库。源代码可在 D3.js 网站上免费获得。下载最新版本的库（当前为 5.7.0）。从源链接下载 D3 库。

第二步：解压下载完成后得到的.zip文件。找到 d3.min.js 文件，它是 D3 源代码的最小版本。复制该文件并将其包含在网页的根文件夹或主库目录中。在网页中，包括 d3.min.js 文件，如图所示。

HTML

Javascript

// Defining d3 contrib variable
var d3 = require('d3');
  
var gfg = d3.greatest([5, 4, 3, 2, 1])
  
console.log(gfg)

示例：在此示例中，我们可以看到通过使用 d3.greatest() 方法，我们能够从数组中的序列中获取最大值。

文件名：index.js

Javascript

// Defining d3 contrib variable
var d3 = require('d3');
  
var gfg = d3.greatest([5, 4, 3, 2, 1])
  
console.log(gfg)

输出：

优点：

D3 支持所有程序员都知道的 HTML、CSS、SVG 等 Web 标准，因此任何人都可以轻松使用它。简而言之，D3 公开了 HTML5、CSS3 和 SVG 等 Web 标准的功能。
它非常轻巧且灵活，代码可重用，因此更可取。
与其他可用的 API 或框架相比，它为用户提供了更广泛的控制来管理可视化和数据。
作为一个开源框架，可以根据自己的需要轻松操作 D3 的源代码。

缺点：

D3 与旧版本的浏览器不兼容。如果有人希望以向后兼容性可视化数据，则可视化可能必然是静态的，因为兼容性差。
安全性对 D3 来说仍然是一个挑战。使用 D3 无法轻松隐藏或保护数据。