Lagrange interpolation: Difference between revisions

From JSXGraph Wiki
No edit summary
No edit summary
 
(8 intermediate revisions by 2 users not shown)
Line 3: Line 3:
The dotted line is the graph of the first derivative, the dashed line is the graph of the second derivative.
The dotted line is the graph of the first derivative, the dashed line is the graph of the second derivative.
<html>
<html>
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/prototype.js"></script>
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script>
<form><input type="button" value="Add point" onClick="addPoint()"></form>
<form><input type="button" value="Add point" onClick="addPoint()"></form>
<div id="box" class="jxgbox" style="width:600px; height:400px;"></div>
</html>
<script language="JavaScript">
<jsxgraph box="box" width="600" height="400">
        board = JXG.JSXGraph.initBoard('box', {originX: 250, originY: 250, unitX: 50, unitY: 25});
var board = JXG.JSXGraph.initBoard('box', {boundingbox: [-5, 10, 7, -6], axis: true});
        // Axes
        b1axisx = board.createElement('axis', [[0,0], [1,0]], {});
        b1axisy = board.createElement('axis', [[0,0], [0,1]], {});


        var p = [];
var p = [];
        p[0] = board.createElement('point', [-1,2], {style:6});
p[0] = board.create('point', [-1,2], {size:4});
        p[1] = board.createElement('point', [3,-1], {style:6});
p[1] = board.create('point', [3,-1], {size:4});
        var f = function(x) {
var f = JXG.Math.Numerics.lagrangePolynomial(p);
                var i;
var graph = board.create('functiongraph', [f,-10, 10], {strokeWidth:3});
                var y = 0.0;
var d1 = board.create('functiongraph', [JXG.Math.Numerics.D(f), -10, 10], {dash:1});
                var xc = [];
var d2 = board.create('functiongraph', [JXG.Math.Numerics.D(JXG.Math.Numerics.D(f)), -10, 10], {dash:2});
                for (i=0;i<p.length;i++) {
 
                  xc[i] = p[i].X();
function addPoint() {
                }
    p.push(board.create('point',[(Math.random()-0.5)*10,(Math.random()-0.5)*3],{size:4}));
                for (i=0;i<p.length;i++) {
    board.update();
                  var t = p[i].Y();
}
                  for (var k=0;k<p.length;k++) {
</jsxgraph>
                    if (k!=i) {
                      t *= (x-xc[k])/(xc[i]-xc[k]);
                    }
                  }
                  y += t;
                }
                return y;
            };
        graph = board.createElement('curve', ['x', f, 'x', -10, 10], {curveType:'graph', strokeWidth:3});
        d1 = board.createElement('curve', ['x', board.D(f), 'x', -10, 10], {curveType:'graph',dash:1});
        d2 = board.createElement('curve', ['x', board.D(board.D(f)), 'x', -10, 10], {curveType:'graph',dash:2});


        function addPoint() {
          p.push(board.createElement('point',[(Math.random()-0.5)*10,(Math.random()-0.5)*3],{style:6}));
          board.update();
        }
         
</script>
</html>
=== References ===
=== References ===
* [http://en.wikipedia.org/wiki/Lagrange_polynomial http://en.wikipedia.org/wiki/Lagrange_polynomial]
* [http://en.wikipedia.org/wiki/Lagrange_polynomial http://en.wikipedia.org/wiki/Lagrange_polynomial]


=== The underlying JavaScript code ===
=== The underlying JavaScript code ===
<source lang="html4strict">
<link rel="stylesheet" type="text/css" href="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraph.css" />
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/prototype.js"></script>
<script type="text/javascript" src="http://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script>
<div id="box" class="jxgbox" style="width:600px; height:400px;"></div>
</source>
<source lang="javascript">
<source lang="javascript">
        board = JXG.JSXGraph.initBoard('box', {originX: 250, originY: 250, unitX: 50, unitY: 25});
var board = JXG.JSXGraph.initBoard('box', {boundingbox: [-5, 10, 7, -6], axis: true});
        // Axes
        b1axisx = board.createElement('axis', [[0,0], [1,0]], {});
        b1axisy = board.createElement('axis', [[0,0], [0,1]], {});
 
        var p = [];
        p[0] = board.createElement('point', [-1,2], {style:6});
        p[1] = board.createElement('point', [3,-1], {style:6});
       
        var f = function(x) {
                var i;
                var y = 0.0;
                var xc = [];
                for (i=0;i<p.length;i++) {
                  xc[i] = p[i].X();
                }
                for (i=0;i<p.length;i++) {
                  var t = p[i].Y();
                  for (var k=0;k<p.length;k++) {
                    if (k!=i) {
                      t *= (x-xc[k])/(xc[i]-xc[k]);
                    }
                  }
                  y += t;
                }
                return y;
            };
        graph = board.createElement('curve', ['x', f, 'x', -10, 10], {curveType:'graph'});
        d1 = board.createElement('curve', ['x', board.D(f), 'x', -10, 10], {curveType:'graph',dash:1});
        d2 = board.createElement('curve', ['x', board.D(board.D(f)), 'x', -10, 10], {curveType:'graph',dash:2});


        function addPoint() {
var p = [];
          p.push(board.createElement('point',[(Math.random()-0.5)*10,(Math.random()-0.5)*3],{style:6}));
p[0] = board.create('point', [-1,2], {size:4});
          board.update();
p[1] = board.create('point', [3,-1], {size:4});
        }
var f = JXG.Math.Numerics.lagrangePolynomial(p);
var graph = board.create('functiongraph', [f,-10, 10], {strokeWidth:3});
var d1 = board.create('functiongraph', [JXG.Math.Numerics.D(f), -10, 10], {dash:1});
var d2 = board.create('functiongraph', [JXG.Math.Numerics.D(JXG.Math.Numerics.D(f)), -10, 10], {dash:2});


function addPoint() {
    p.push(board.create('point',[(Math.random()-0.5)*10,(Math.random()-0.5)*3],{size:4}));
    board.update();
}
</source>
</source>


Line 99: Line 46:
[[Category:Examples]]
[[Category:Examples]]
[[Category:Calculus]]
[[Category:Calculus]]
[[Category:Interpolation]]

Latest revision as of 15:20, 20 February 2013

Constructs a polynomial of degree [math]\displaystyle{ n }[/math] through [math]\displaystyle{ n+1 }[/math] given points. Points can be added by clicking on "Add point". The dotted line is the graph of the first derivative, the dashed line is the graph of the second derivative.

References

The underlying JavaScript code

var board = JXG.JSXGraph.initBoard('box', {boundingbox: [-5, 10, 7, -6], axis: true});

var p = [];
p[0] = board.create('point', [-1,2], {size:4});
p[1] = board.create('point', [3,-1], {size:4});
var f = JXG.Math.Numerics.lagrangePolynomial(p);
var graph = board.create('functiongraph', [f,-10, 10], {strokeWidth:3});
var d1 = board.create('functiongraph', [JXG.Math.Numerics.D(f), -10, 10], {dash:1});
var d2 = board.create('functiongraph', [JXG.Math.Numerics.D(JXG.Math.Numerics.D(f)), -10, 10], {dash:2});

function addPoint() {
    p.push(board.create('point',[(Math.random()-0.5)*10,(Math.random()-0.5)*3],{size:4}));
    board.update();
}