• d3的常用方法和数据类型


    1. 选择集自身属性

    1. selection.empty() 选择集是否为空,为空返回true,否则返回false

    2. selection.node() 返回第一个非空元素,无则返回null

    3. selection.size() 返回选择集中的元素个数

    2. 选择集元素属性

    1. attr 设置属性

    2. classed 设置class

    3. style 设置行内样式

    4. property 设置属性,区别于attr,部分属性不能用attr,例如 input的value,复选框的checked等,不会显示在标签上的属性

    5. text 设置或获取元素内部的内容,不包括标签,效果同innerText

    6. html 设置或获取元素颞部的html,效果同innerHTML

    3. 选择集的增删

    1. append(name) 追加元素,name为元素名

    2. insert(name,[before]) 插入,name为元素名称,before为css选择器

    3. remove() 删除元素

    选择集遍历、排序、过滤

    1. each((d,i) => {}) 遍历

    2. filter((d,i) => {}) 过滤

    3. sort((a,b) => {}) 排序,同js的array的sort

    4. call(func) 对选择集的每一个元素调用func函数

    4. d3数组常用操作

    1. d3.ascending 升序函数 var nums = [1,5,2]; nums.sort(d3.ascending);

    2. d3.descending 降序函数 var nums = [1,2,5]; nums.sort(d3.descending);

    3. d3.min 最小值

    4. d3.max 最大值

    5. d3.extend 最小和最大值

    6. d3.sum 求和

    7. d3.mean 求平均值

    8. d3.range([start,]stop[,step]) 返回范围,等差数列

    9. d3.shuffle 洗牌数组

    10. d3.merge 合并数组

    5. d3的映射

    d3的映射,map,就是key-value键值对,形式上与js的map有些区别。

    d3.map([object][,key]) 会产生一个映射,其value,就是object的每个项,key是后面指定的key

    例如:

    var dataset = [
        {id: 1000, color: "red"},
        {id: 1001, color: "green"},
        {id: 1002, color: "blue"}
    ]
    
    var map = d3.map(dataset, function(d){return d.id});

    得到的映射是 key为 id,value为数组的一项,例如 {id: 1000, color: "red"}

    映射有一些常用方法

    map.has(key) 
    map.get(key)
    map.set(key,value)
    map.remove(key)
    map.keys()
    map.values()
    map.entries()
    map.each()
    map.empty()  //是否为空
    map.size()   //映射大小
  • 相关阅读:
    ps插件安装
    CSS3时钟式进度条
    手机web——自适应网页设计(html/css控制)
    7个设计师必备的国际顶尖设计网站
    中​文​字​号​、​磅​和​像​素​对​照​关​系
    图标字体
    用AE如何制作如下三个loading动效,
    u盘装系统
    SpringBoot:Maven创建一个HelloWorld
    eclipse中配置maven和创建第一个 Spring Boot Application
  • 原文地址:https://www.cnblogs.com/mengff/p/12969855.html
Copyright © 2020-2023  润新知