式に基づく折れ線グラフ

Question

データではなく式に基づいて折れ線グラフを作成できますか？

など。式は、私がメニューでデータを操作できるように、理想的には私がドロップダウンメニューにa、bとcを結合する

Y = aX + bZ + cW

である可能性があります。しかし、私の問題は、データではなく数式に基づいてグラフを作成することです。

Answer 1

データを作成するには、ドロップダウンを使用します。

f(x) = sin(a * sin(b * sin(c * sin(x))))としたいとします。あなたのページに3つのスライダを追加し、その値に基づいてグラフを描く：

// Grab slider values 
var a = document.querySelector('#a').value; 
var b = document.querySelector('#b').value; 
var c = document.querySelector('#c').value; 

// Construct data from a, b, c 
var data = d3.range(-10, 10, 0.01).map(function(v) { 
    return { 
     x: v, 
     y: sin(a * sin(b * sin(c * sin(v)))) 
    }; 
}); 

// JOIN 
var paths = svg.selectAll('path.line') 
    .data([data]); 

// ENTER 
paths.enter().append('path') 
    .attr('class', 'line') 
// ENTER + UPDATE 
    .merge(paths) 
    .transition() 
    .duration(500) 
    .attr('d', line); 

ここで、三スライダーチャートです： https://bl.ocks.org/gabrielflorit/14435cead80c690105ebbbc35b75796f、GIFと（理由はないので）。