绑定颜色数据，在d 3

我复制“甜甜圈倍数”（http://bl.ocks.org/mbostock/3888852）从D3库用于不同目的例如：以显示生物样品的RNA测序是否通过某些质量控制测试。绑定颜色数据，在d 3

到目前为止，我有这样的代码：http://tributary.io/inlet/5293726道歉的混乱。您可以看到的例子，该派有22个片，每个22个测试（对于那些有兴趣，2x11测试每个测序读数）。我知道这是不是想象此信息的最佳方式，而我计划使用堆积条形图或矩阵来显示这个数据，但1这可以表明他们最初被收集在布局中的生物样品，在8×12格（不固定，需要调整您的浏览器）和2。这是我对现在和学习结合的色彩元素D3这个概念可以在图表类型使用。

我的问题是这样的：当我绑定数据时，与该元素相关的值现在为100，并且我不能再访问我为单元格的每一行创建的其他对象，即d.test_colors，它具有与PASS，WARN，和FAIL对于每个22次测试相关联的颜色。

这是我喜欢的工作线：

.style('fill', function (d,i) { 
    console.log('in style fill: d', d) 
    //   console.log(d.reads.if_experiment); 
// return d.data.test_colors[i]; 
       return '#A6CEE3'; 
});

现在，它只是返回的淡蓝色，但我想它返回22 test_colors之一，因此i用于遍历阵列。

看着'甜甜圈倍数'的例子，他们做了一些绑定的颜色域的值，但我不知道如何将其集成到我的设置。

来源

2013-04-05 Olga Botvinnik

原来的伎俩是通过对象的列表中为每个所需的“甜甜圈”的“切片”，并保持在该对象的颜色信息。

的关键代码是在这里：

var pie = d3.layout.pie() 
    .sort(null) 
    .value(function (d) { 
    return d.slice; 
}); 
... 
d.tests = [] 
... 
(in a for loop) 
    d.tests.push({color: r1Colors(d[test]), result: d[test], 
         slice:100, test_name: test}); 
... 
svg.selectAll(".arc") 
    .data(function(d){ 
     return pie(d.tests); }) 
    .enter().append('path') 
    .attr('class', 'arc') 
    .attr('d', arc) 
    .style('fill', function (d,i) { 
    return d.data.color; 
});

工作例如：http://tributary.io/inlet/5332310

来源

2013-04-08 00:43:39

绑定颜色数据，在d 3

回答

相关问题