Difference between revisions of "Change Equation of a Graph"

From JSXGraph Wiki
Jump to: navigation, search
(Replacing page with 'This example shows how you can change the equation of a graph without creating the whole construction again. <nowiki><input type="text" id="eingabe" value="Math.sin(x)*Math.cos...')
Line 1: Line 1:
 
This example shows how you can change the equation of a graph without creating the whole construction again.
 
This example shows how you can change the equation of a graph without creating the whole construction again.
 
+
<nowiki><input type="text" id="eingabe" value="Math.sin(x)*Math.cos(x)">
<div style="width:960px">
+
</nowiki>
<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>
 

Revision as of 10:35, 15 September 2008

This example shows how you can change the equation of a graph without creating the whole construction again. <input type="text" id="eingabe" value="Math.sin(x)*Math.cos(x)">