D3.js 是一个强大的 JavaScript 库，用于在网页上创建动态的、交互式的数据可视化。以下是快速入门指南，帮助您开始使用 D3.js。

安装 D3.js

首先，您需要将 D3.js 添加到您的项目中。您可以从 D3.js 的官方网站下载最新版本的库文件，或者使用以下命令通过 npm 安装：

npm install d3

基础示例

以下是一个简单的 D3.js 示例，它将创建一个条形图：

// 引入 D3.js 库
const d3 = require('d3');

// 创建 SVG 元素
const svg = d3.select('body').append('svg')
    .attr('width', 500)
    .attr('height', 300);

// 定义数据
const data = [30, 50, 70, 80, 90];

// 创建比例尺
const xScale = d3.scaleLinear()
    .domain([0, d3.max(data)])
    .range([0, 500]);

// 创建 Y 轴
const yScale = d3.scaleLinear()
    .domain([0, 100])
    .range([300, 0]);

// 绘制条形图
svg.selectAll('rect')
    .data(data)
    .enter().append('rect')
    .attr('x', (d, i) => xScale(i))
    .attr('y', d => yScale(d))
    .attr('width', () => xScale(1))
    .attr('height', d => 300 - yScale(d))
    .attr('fill', 'blue');

学习资源

如果您想进一步学习 D3.js，以下是一些推荐的学习资源：

希望这个快速入门指南能帮助您开始使用 D3.js。祝您学习愉快！

D3js Logo