Simple function plotter: Difference between revisions
From JSXGraph Wiki
A WASSERMANN (talk | contribs) No edit summary |
A WASSERMANN (talk | contribs) No edit summary |
||
Line 1: | Line 1: | ||
Plots a function together with its derivative. | Plots a function together with its derivative. | ||
You can change the function term here: | |||
<html> | <html> | ||
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /> | <link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" /> | ||
Line 56: | Line 57: | ||
</html> | </html> | ||
<source lang=" | <source lang="html4strict"> | ||
<form><textarea id="input" rows=7 cols=35 wrap="off" > | <form><textarea id="input" rows=7 cols=35 wrap="off" > | ||
function f(x) { | function f(x) { |
Revision as of 17:04, 3 December 2008
Plots a function together with its derivative. You can change the function term here:
<form><textarea id="input" rows=7 cols=35 wrap="off" >
function f(x) {
return Math.cos(x)*p.Y();
}
c = plot(f);
// Derivative:
g = board.algebra.D(f);
plot(g,{strokecolor:'black', dash:1});
</textarea> <br>
<input type="button" value="run" onClick="doIt()" style='margin:1em'>
<input type="button" value="clear all" onClick="board=clearAll(board)">
board = JXG.JSXGraph.initBoard('box', {originX: 250, originY: 250, unitX: 40, unitY: 40});
// Axes
b1axisx = board.createElement('axis', [[0,0], [1,0]], {});
b1axisy = board.createElement('axis', [[0,0], [0,1]], {});
// Macro function plotter
function addCurve(board, func, atts) {
var f = board.createElement('curve', ['x', func, 'x'], atts);
return f;
}
// Simplified plotting of function
function plot(func, atts) {
if (atts==null) {
return addCurve(board, func, {strokewidth:2, curveType:'graph'});
} else {
return addCurve(board, func, atts);
}
}
// Free point
var p = board.createElement('point', [3,-4], {style:6, name:'drag me'});
// Usage of the macro
function doIt() {
eval($('input').value);
}
function clearAll(board) {
JXG.JSXGraph.freeBoard(board);
board = JXG.JSXGraph.initBoard('jxgbox', {originX: 250, originY: 250, unitX: 40, unitY: 20});
b1axisx = board.createElement('axis', [[0,0], [1,0]], {});
b1axisy = board.createElement('axis', [[0,0], [0,1]], {});
return board;
}