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; 
});