D3数学函数创建

Question

我想为我的D3页面创建一个数学函数。

• 每个节点都得到了一个“分数”我可以得到通过d.score

我喜欢创造绘制基于该得分圈的半径的函数。

我考虑以下：

ř< = 10，R> = 3

10 - （d.score/50）= R

如何能做到这一点在D3？

.attr('r', function(d) { 
    return node_size(* * ? ? ? * *); 
}); 

亲切的问候， 马克

Answer 1

首先需要定义，将您node_size的值映射到实际半径的线性度，如下（例如）：

r = d3.scale.linear().range([3,10]); 

然后指定为域，你的score参数的值如下（假设DATA是您的数据结构）

// first define your radius according to your formula specified in your question. 
DATA.forEach(function(d){ 
    d.radius=10 - (d.score/50); 
}) 
//Then, assign is as a domain of your radius function 
r.domain(d3.extent(DATA.map(function(d){return d.radius;}))) 

最后，绘制你的数据时，你应该做这样的事情：

.attr('r', function(d) {return r(d.radius)}); 

你可以合并或优化这些步骤，但我认为这是一个良好的开端。

希望这会有所帮助。

Answer 2

请注意，这可能是一个坏的问题，由于它的“请给我这个问题的代码”字。

无论如何，我认为这是你想尝试我猜：

.attr('r', function(d) { 
    var r = 10 - (d.score/50); 
    if (r > 10) {r = 10;} 
    else if (r < 3) {r = 3;} 
    return r; 
});