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