Change Equation of a Graph

From JSXGraph Wiki
Revision as of 09:23, 15 September 2008 by Matthias (talk | contribs) (New page: This example shows how you can change the equation of a graph without creating the whole construction again. <nowiki><div style="width:960px"> <div id="jxgbox" class="jxgbox" style="width:...)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

This example shows how you can change the equation of a graph without creating the whole construction again. <div style="width:960px"> <div id="jxgbox" class="jxgbox" style="width:600px; height:400px; float:left; "></div> <p style="float:right"> <input type="text" id="eingabe" value="Math.sin(x)*Math.cos(x)"> <input type="button" value="set" onClick="doIt()" style='margin:1em'> </p> </div> <br clear=all> <div id="debug" style="display:none;"></div> <script type="text/javascript"> /* <![CDATA[ */ board = JXG.JSXGraph.initBoard('jxgbox', {originX: 250, originY: 250, unitX: 40, unitY: 20}); // Axes b1axisx = board.createElement('axis', [[1,0], [0,0]], {}); b1axisy = board.createElement('axis', [[0,1], [0,0]], {}); eval("function f(x){ return "+document.getElementById("eingabe").value+";}"); graph = board.createElement('curve', [function(x){ return x; }, function(x){ return f(x); }, "x", -10, 10]); //graph = eval("board.createElement('curve', [function(x){ return x; }, function(x){ return "+document.getElementById("eingabe").value+";}, 'x', -10, 10])"); //graph.curveType = "graph"; p1 = board.createElement('glider', [graph], {style:6, name:'P'}); g = board.algebra.D(f); p2 = board.createElement('point', [function() { return p1.X()+1;}, function() {return p1.Y()+board.algebra.D(graph.Y)(p1.X());}], {style:1, name:''}); l1 = board.createElement('line', [p1,p2],{}); p3 = board.createElement('point', [function() { return p2.X();}, function() {return p1.Y();}],{style:1, name:''}); pol = board.createElement('polygon', [p1,p2,p3], {}); t = board.createElement('text', [function(){return p1.X()+1.1;},function(){return p1.Y()+(p2.Y()-p3.Y())/2;},function(){ return "m="+(board.round(p2.Y()-p3.Y(),2));}]); function doIt(){ eval("function f(x){ return "+document.getElementById("eingabe").value+";}"); graph.yterm = function(x){ return f(x); }; // usually: e.g. "x^2" //graph.yterm = eval("function(x){ return "+document.getElementById("eingabe").value+"; };"); graph.Y = graph.yterm; graph.updateCurve(); board.update(); } /* ]]> */ </script>