jsxgraph - JSX グラフを使用して f(x) と f(xa) のグラフを作成する

Question

jsxグラフを使用して、f(x)(ユーザー入力)のグラフとスライダーからaの値を受け取ったf(xa)のグラフをどのようにプロットできますか? たとえば、ユーザーが x x を入力し、スライダーの a の値が 1 の場合、2 つのグラフが jsx ボードに表示されます。1 つは x で、もう 1 つは (x-1) (x-1)?

Answer 1

テキストボックスの関数を変更することから私の答えを拾うと、グラフは変更されません。ユーザー提供f(x)の関数とf(x-a)スライダーに依存する関数の同時プロットは次のようになります。

board = JXG.JSXGraph.initBoard('box', {boundingbox: [-6, 12, 8, -6], axis: true});
a = board.create('slider', [[-4,7], [4,7], [-10, 1,10]], {name:'a'});

doPlot = function() {
    var txtraw = document.getElementById('input').value, // Read user input
        f = board.jc.snippet(txtraw, true, 'x', true), // Parse input with JessieCode
        curve, curve2;

    board.removeObject('f'); // Remove element with name f
    board.removeObject('g'); // Remove element with name g
    curve = board.create('functiongraph', [f, -10, 10], {name:'f'});
    curve2 = board.create('functiongraph', [
        function(x) {
            return f(x - a.Value());
        }, -10, 10], {name:'g', strokeColor: 'red'});
};

doPlot();

つまり、トリックは、 を返す 2 番目の関数を定義することf(x-a)です。https://jsfiddle.net/qmp0qdvv/1/を参照してください。上記の他の問題と同様に、この例では、JSXGraph の JessieCode パーサーを使用して、JavaScript コードの代わりに単純な数学構文を入力できます。