Differential equations
Plot ordinary differential equations (ODE), i.e. display solutions of the ordinary differential equation
$y'= f(t,y)$ with initial value $(t_0,y_0)$.
f(t,y):
f(t,y):<input type="text" id="odeinput" value="(2-t)*y + c"><input type=button value="ok" onclick="doPlot()">// Define the id of your board in BOARDID
const board = JXG.JSXGraph.initBoard(BOARDID, {axis:true, boundingbox:[-11,11,11,-11]});
var N = board.create('slider', [[-7, 9.5], [7, 9.5], [-15, 10, 15]], {name:'N'});
var slider = board.create('slider', [[-7, 8], [7, 8], [-15, 0, 15]], {name:'c'});
var P = board.create('point', [0, 1], {name:'(t_0, y_0)'});
var f;
var doPlot = function() {
var snip = board.jc.snippet(document.getElementById('odeinput').value, true, 't, y');
f = (t, y) => [snip(t, y[0])];
board.update();
}
// Solve ODE
var ode = function() {
return JXG.Math.Numerics.rungeKutta('heun', [P.Y()], [P.X(), P.X()+N.Value()], 200, f);
}
var g = board.create('curve', [[0],[0]], {strokeColor:'red', strokeWidth:2});
// In each update, solve ODE from t_0 to t_0 + N and plot solution
g.updateDataArray = function() {
var data = ode();
var h = N.Value() / 200;
var i;
this.dataX = [];
this.dataY = [];
for (i = 0; i < data.length; i++) {
this.dataX[i] = P.X() + i * h;
this.dataY[i] = data[i][0];
}
};
// Inital plotting
doPlot();
This example is licensed under a Creative Commons Attribution 4.0 International License.
Please note that you have to mention The Center of Mobile Learning with Digital Technology in the credits.