Newton's root finding method

From JSXGraph Wiki
Jump to navigationJump to search

xo is the start value. Drag it.

You may change the function term here, Try also the following function terms:
  • Math.sin(x)
  • Math.exp(x)
  • Math.pow(2,x)
  • 1-2/(x*x)

f(x) =
 

The underlying JavaScript code

<table width="600" border="0" cellpadding="0" cellspacing="0">
x<sub>o</sub> is the start value. Drag it.
<p></p>
You may change the function term here:
<br>
<td><nobr>f(x) = </nobr></td>
<td>
<form>
<input style="border:none; background-color:#efefef;padding:5px;margin-left:2px;" type="text" id="graphterm" value="x*x*x/5" size="30"/>
<input type="button" value="set term" onClick="newGraph(document.getElementById('graphterm').value);">
</form>
</td>
<tr><td>&nbsp;</td></tr>
<script type="text/javascript">
// Initial function term
var term = function(x) { return x*x*x/5; };
var graph = function(x) { return term(x); };
	
// Recursion depth
var steps = 11;
// Start value
var s = 3;

for (i = 0; i < steps; i++) {
     document.write('<tr><td><nobr>x<sub>' + i + '</sub> = </nobr></td><td><font id="xv' + i + '"></font></td></tr>');
}
</script>		
</table>
var i;
var brd = JXG.JSXGraph.initBoard('jxgbox', {boundingbox:[-5,5,5,-5], axis:false});
var ax = brd.create('axis', [[0,0], [1,0]], {strokeColor: 'black'});
var ay = brd.create('axis', [[0,0], [0,1]], {strokeColor: 'black'});

var g = brd.create('functiongraph', [function(x){return graph(x);}],{strokeWidth: 2, dash:0});
var x = brd.create('glider',[s,0,ax], {name: 'x_{0}', strokeColor: 'magenta', fillColor: 'yellow'});

newGraph(document.getElementById('graphterm').value);
newton(x, steps, brd);	

function xval() {
    for (i = 0; i < steps; i++)
        document.getElementById('xv' + i).innerHTML = (brd.select('x_{' + i + '}').X()).toFixed(14);
}

brd.addHook(xval);

function newton(p, i, board) {	
    board.suspendUpdate();	
    if(i>0) {
        var f = board.create('glider',[function(){return p.X();}, function(){return graph(p.X())},g], {name: '', style: 3, strokeColor: 'green', fillColor: 'yellow'});
        var l = board.create('line', [p,f],{strokeWidth: 0.5, dash: 1, straightFirst: false, straightLast: false, strokeColor: 'black'});
        var t = board.create('tangent',[f],{strokeWidth: 0.5, strokeColor: '#0080c0', dash: 0});
        var x = board.create('intersection',[ax,t,0],{name: 'x_{'+(steps-i+1) + '}', style: 4, strokeColor: 'magenta', fillColor: 'yellow'});
        newton(x,--i, board);
    }
    board.unsuspendUpdate();    
}	
function newGraph(v) {
	eval("term = function(x){ return "+v+";}");				
	graph = function(x) { return term(x); };
	g.Y = function(x){ return term(x); };
	g.updateCurve();
        brd.update();
}