使用 JSX 图创建 f(x) 和 f(x-a) 的图

Creating graph of f(x) and f(x-a) by using JSX graph

f(x)的图形(用户输入)和f(x-a)的图形,其中a的值是从滑块接收的,如何使用jsx图形绘制?例如,如果用户输入 xx 并且滑块的 a 值为 1,则两个图形将出现在 jsx 板上:一个是 x 的,另一个是 (x-1)(x-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();

这意味着诀窍是定义第二个函数 returns f(x-a)。参见 https://jsfiddle.net/qmp0qdvv/1/。与上述其他问题一样,此示例允许使用 JSXGraph 的 JessieCode 解析器输入纯数学语法而不是 JavaScript 代码。