D3入门教程——选择数据和数据绑定

最新推荐文章于 2021-09-22 16:16:25 发布

我是大魔王2

最新推荐文章于 2021-09-22 16:16:25 发布

阅读量1.1k

点赞数 1

分类专栏： D3入门教程文章标签： D3入门教程

本文链接：https://blog.csdn.net/mylovewanzi/article/details/99696506

版权

文章目录

一、如何选择元素
二、如何绑定元素
- 1.datum()
- 2.data()

一、如何选择元素

d3.select()：是选择所有指定元素的第一个
d3.selectAll()：是选择指定元素的全部

例如：

var body = d3.select("body"); //选择文档中的body元素
var p1 = body.select("p");      //选择body中的第一个p元素
var p = body.selectAll("p");    //选择body中的所有p元素
var svg = body.select("svg");   //选择body中的svg元素
var rects = svg.selectAll("rect");  //选择svg中所有的svg元素

二、如何绑定元素

datum()：绑定一个数据到选择集上
data()：绑定一个数组到选择集上，数组的各项值分别与选择集的各元素绑定

1.datum()

绑定一个数据到选择集上。

代码：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

我是大魔王2

关注关注

1
点赞
踩
5

收藏

觉得还不错? 一键收藏
0
评论
D3入门教程——选择数据和数据绑定

文章目录一、如何选择元素二、如何绑定元素1.datum()一、如何选择元素d3.select()：是选择所有指定元素的第一个d3.selectAll()：是选择指定元素的全部例如：var body = d3.select("body"); //选择文档中的body元素var p1 = body.select("p"); //选择body中的第一个p元素var p = ...
复制链接

扫一扫