你的位置:首页 > 软件开发 > Java > D3.js data() 方法详解

D3.js data() 方法详解

发布时间:2015-12-08 12:00:05
Binding data(数据绑定)  D3各种图表的作用体现在将数据(Data)转换成可视化的过程。  比如将一个月的气温数据,通过树形图来展现,能够直观的看到气温走势,下个月还需不需要穿秋裤 :)  我们通过D3的 selection.data() 方法来将 data 绑定到 ...

Binding data(数据绑定)

  D3各种图表的作用体现在将数据(Data)转换成可视化的过程。

  比如将一个月的气温数据,通过树形图来展现,能够直观的看到气温走势,下个月还需不需要穿秋裤 :)

  我们通过D3的 selection.data() 方法来将 data 绑定到 DOM 元素。因此,一个绑定过程的必要条件既是:data 和 DOM目标元素(没有目标元素,你还bind个卵~)。

 

从Data说起...

  D3还是很聪明的,可以处理多种data类型,像数组、字符串、对象类型。同样可以优雅的接受JSON,更牛B的是它拥有自己的内部方法,可以直接加载CSV文件(当然需要load CSV文件就不是我们在桌面创建个index.html然后用chrome打开那么easy了,你需要一个应用server,通过http还是https来获取CSV并加载了)。

  这里我们先准备一个简单的数组吧

var dataset = [1, 2, 3, 4, 5];
// .text(function(d, i){return "sample"}) 这里可以看到另一个参数i, i在此处的值表示的是当前 d 元素在 dataset 中的索引位置

原标题:D3.js data() 方法详解

关键词:JS

JS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。