Difference between revisions of "Polynomial regression I"

From JSXGraph Wiki
Jump to navigationJump to search
 
(51 intermediate revisions by the same user not shown)
Line 5: Line 5:
 
var data = "406.60 428.50 429.30 426.30 434.70 415.90 419.00 408.80 410.10 408.30 420.40 415.20 409.70 408.90 411.00 410.60 409.60 409.50 409.80 413.00 417.90 415.80 415.50 421.30 423.50 426.80 426.60 427.20 433.30 435.00 442.50 447.00 450.60 448.90 446.20 443.60 446.30 448.20 452.40 451.30 451.80 459.90 464.70 467.30 463.50 466.60 461.10 464.90 467.30 458.40 458.80 463.20 462.40 461.10 465.50 461.50 458.20 460.80 459.30 445.70 425.10 437.60 438.00 436.60 437.60 437.60 438.60 443.10 446.40 445.90 450.80 451.60 457.30 456.70 455.60 454.75 453.90 451.20 450.70 446.80 443.40 448.40 451.80 449.80 449.10 447.60 448.40 450.00 443.00 440.60 437.40 435.40 432.00 430.80 429.60 437.10 440.00 438.30 435.20 436.60 435.25 433.90 436.50 436.30 437.40 441.00 445.40 450.10 449.20 450.50 455.60 452.00 451.80 456.80 455.30 457.40 457.40 461.10 459.60 462.40 463.40 464.60 469.00 472.20 471.80 470.10 465.20 470.40 468.50 468.70 469.70 472.50 474.70 472.40 475.00 476.10 473.20 471.50 472.20 471.10 472.80 470.40 470.50 472.10 471.10 468.50 465.50 465.70 465.40 466.90 468.85 470.80 474.00 478.10 480.50 481.00 479.10 476.40 469.80 471.60 470.60 467.20 473.10 471.70 474.80 477.20 474.60 475.10 475.90 475.80 472.00 470.80 469.10 464.30 463.70 467.20 467.30 467.10 465.60 462.70 449.45 436.20 466.00 467.40 467.00 471.50 469.80 474.20 476.10 477.10 480.30 478.70 478.80 479.30 479.30 478.30 477.20 480.20 484.10 488.70 492.70 492.60 491.90 491.90 495.10 494.50 494.50 496.90 496.20 498.40 498.00 496.00 497.90 495.40 497.30 495.20 499.20 500.60 497.90 499.60 497.00 498.10 496.70 491.40 487.60 486.70 487.40 489.30 485.30 501.80 485.40 491.30 495.50 501.80 504.50 502.50 505.80 510.30 511.90 509.90 508.70 510.70 512.90 512.90 513.80 516.10 512.10 511.10 505.30 505.10 505.20 508.40 510.70 511.30 514.90 517.30 519.70 521.80 524.40 526.80";
 
var data = "406.60 428.50 429.30 426.30 434.70 415.90 419.00 408.80 410.10 408.30 420.40 415.20 409.70 408.90 411.00 410.60 409.60 409.50 409.80 413.00 417.90 415.80 415.50 421.30 423.50 426.80 426.60 427.20 433.30 435.00 442.50 447.00 450.60 448.90 446.20 443.60 446.30 448.20 452.40 451.30 451.80 459.90 464.70 467.30 463.50 466.60 461.10 464.90 467.30 458.40 458.80 463.20 462.40 461.10 465.50 461.50 458.20 460.80 459.30 445.70 425.10 437.60 438.00 436.60 437.60 437.60 438.60 443.10 446.40 445.90 450.80 451.60 457.30 456.70 455.60 454.75 453.90 451.20 450.70 446.80 443.40 448.40 451.80 449.80 449.10 447.60 448.40 450.00 443.00 440.60 437.40 435.40 432.00 430.80 429.60 437.10 440.00 438.30 435.20 436.60 435.25 433.90 436.50 436.30 437.40 441.00 445.40 450.10 449.20 450.50 455.60 452.00 451.80 456.80 455.30 457.40 457.40 461.10 459.60 462.40 463.40 464.60 469.00 472.20 471.80 470.10 465.20 470.40 468.50 468.70 469.70 472.50 474.70 472.40 475.00 476.10 473.20 471.50 472.20 471.10 472.80 470.40 470.50 472.10 471.10 468.50 465.50 465.70 465.40 466.90 468.85 470.80 474.00 478.10 480.50 481.00 479.10 476.40 469.80 471.60 470.60 467.20 473.10 471.70 474.80 477.20 474.60 475.10 475.90 475.80 472.00 470.80 469.10 464.30 463.70 467.20 467.30 467.10 465.60 462.70 449.45 436.20 466.00 467.40 467.00 471.50 469.80 474.20 476.10 477.10 480.30 478.70 478.80 479.30 479.30 478.30 477.20 480.20 484.10 488.70 492.70 492.60 491.90 491.90 495.10 494.50 494.50 496.90 496.20 498.40 498.00 496.00 497.90 495.40 497.30 495.20 499.20 500.60 497.90 499.60 497.00 498.10 496.70 491.40 487.60 486.70 487.40 489.30 485.30 501.80 485.40 491.30 495.50 501.80 504.50 502.50 505.80 510.30 511.90 509.90 508.70 510.70 512.90 512.90 513.80 516.10 512.10 511.10 505.30 505.10 505.20 508.40 510.70 511.30 514.90 517.30 519.70 521.80 524.40 526.80";
 
data = data.split(' ');
 
data = data.split(' ');
 +
 
var datax = [];
 
var datax = [];
 
for (i = 0; i < data.length; i++)  {  
 
for (i = 0; i < data.length; i++)  {  
 +
    datax[i] = i;
 
     data[i] = (parseFloat(data[i])-450.0);  
 
     data[i] = (parseFloat(data[i])-450.0);  
    datax[i] = i;
 
 
}
 
}
   
+
 
var brd = JXG.JSXGraph.initBoard('jxgbox', {boundingbox:[-2, 100, data.length+2, -70], grid: false, axis:true});
 
var brd = JXG.JSXGraph.initBoard('jxgbox', {boundingbox:[-2, 100, data.length+2, -70], grid: false, axis:true});
 +
 
brd.suspendUpdate();
 
brd.suspendUpdate();
 
var s = brd.create('slider',[[10,70],[80,70],[0,1,1]],{name:'scale'});     
 
var s = brd.create('slider',[[10,70],[80,70],[0,1,1]],{name:'scale'});     
 
var deg = brd.create('slider',[[10,90],[80,90],[1,1,10]],{name:'degree',snapWidth:1});     
 
var deg = brd.create('slider',[[10,90],[80,90],[1,1,10]],{name:'degree',snapWidth:1});     
var curve = brd.create('curve',[[],[]],{strokeColor:'gray',dash:2});    
+
 
 +
var curve = brd.create('curve',[[],[]],{strokeColor:'gray',strokeWidth:2, dash:2});
 
curve.updateDataArray = function() {
 
curve.updateDataArray = function() {
 
     var i, len = data.length;
 
     var i, len = data.length;
 
     this.dataX = datax.slice(0,len);  
 
     this.dataX = datax.slice(0,len);  
     for(i=0;i<len;i++) this.dataY[i] = s.Value()*data[i];  
+
     for (i=0; i<len; i++) {
 +
      this.dataY[i] = s.Value()*data[i];  
 +
    }
 
}
 
}
var regressionPolynomial = JXG.Math.Numerics.regressionPolynomial(deg,datax,curve.dataY);
+
curve.update(); // Needed for correct glider position
  
var reg = brd.create('functiongraph',[regressionPolynomial],{strokeColor:'black'});     
+
var regressionPolynomial = JXG.Math.Numerics.regressionPolynomial(deg, datax, curve.dataY);
 +
var reg = brd.create('functiongraph',[regressionPolynomial],{strokeColor:'blue', strokeWidth:4});     
 
brd.create('glider',[100,30,reg],{strokeColor:'black'});     
 
brd.create('glider',[100,30,reg],{strokeColor:'black'});     
  
Line 29: Line 35:
 
             function(){ return "r(x) = " + regressionPolynomial.getTerm();}
 
             function(){ return "r(x) = " + regressionPolynomial.getTerm();}
 
             ],
 
             ],
             {strokeColor:'black',fontSize:'14px'});     
+
             {strokeColor:'black',fontSize:18});     
 +
 
 
brd.unsuspendUpdate();
 
brd.unsuspendUpdate();
 
</jsxgraph>
 
</jsxgraph>
Line 47: Line 54:
 
var s = brd.create('slider',[[10,70],[80,70],[0,1,1]],{name:'scale'});     
 
var s = brd.create('slider',[[10,70],[80,70],[0,1,1]],{name:'scale'});     
 
var deg = brd.create('slider',[[10,90],[80,90],[1,1,10]],{name:'degree',snapWidth:1});     
 
var deg = brd.create('slider',[[10,90],[80,90],[1,1,10]],{name:'degree',snapWidth:1});     
var curve = brd.create('curve',[[],[]],{strokeColor:'gray',dash:2});   
 
 
curve.updateDataArray = function() {
 
curve.updateDataArray = function() {
 
     var i, len = data.length;
 
     var i, len = data.length;
 
     this.dataX = datax.slice(0,len);  
 
     this.dataX = datax.slice(0,len);  
     for(i=0;i<len;i++) this.dataY[i] = s.Value()*data[i];  
+
     for (i=0; i<len; i++) {
 +
      this.dataY[i] = s.Value()*data[i];  
 +
    }
 
}
 
}
var regressionPolynomial = JXG.Math.Numerics.regressionPolynomial(deg,datax,curve.dataY);
+
curve.update(); // Needed for correct glider position
  
var reg = brd.create('functiongraph',[regressionPolynomial],{strokeColor:'black'});     
+
var regressionPolynomial = JXG.Math.Numerics.regressionPolynomial(deg, datax, curve.dataY);
 +
var reg = brd.create('functiongraph',[regressionPolynomial],{strokeColor:'blue', strokeWidth:4});     
 
brd.create('glider',[100,30,reg],{strokeColor:'black'});     
 
brd.create('glider',[100,30,reg],{strokeColor:'black'});     
  
Line 61: Line 70:
 
             function(){ return "r(x) = " + regressionPolynomial.getTerm();}
 
             function(){ return "r(x) = " + regressionPolynomial.getTerm();}
 
             ],
 
             ],
             {strokeColor:'black',fontSize:'14px'});     
+
             {strokeColor:'black',fontSize:18});     
 
brd.unsuspendUpdate();
 
brd.unsuspendUpdate();
 
</source>
 
</source>
  
 
[[Category:Examples]]
 
[[Category:Examples]]

Latest revision as of 19:04, 21 November 2013

Through the points defining the dashed line the regression polynomial of degree 'degree' is computed and displayed. The points can be scaled by adjusting the slider 'scale'. The degree of the regression polynomial can be changed by using the slider 'degree'.

The underlying JavaScript code

var data = "406.60 428.50 429.30 426.30 434.70 415.90 ... many points ... 521.80 524.40 526.80";
data = data.split(' ');
var datax = [];
for (i = 0; i < data.length; i++)  { 
    data[i] = (parseFloat(data[i])-450.0); 
    datax[i] = i;
}
    
var brd = JXG.JSXGraph.initBoard('jxgbox', {boundingbox:[-2, 100, data.length+2, -70], grid: false, axis:true});
brd.suspendUpdate();
var s = brd.create('slider',[[10,70],[80,70],[0,1,1]],{name:'scale'});     
var deg = brd.create('slider',[[10,90],[80,90],[1,1,10]],{name:'degree',snapWidth:1});     
curve.updateDataArray = function() {
    var i, len = data.length;
    this.dataX = datax.slice(0,len); 
    for (i=0; i<len; i++) {
       this.dataY[i] = s.Value()*data[i]; 
    }
}
curve.update(); // Needed for correct glider position

var regressionPolynomial = JXG.Math.Numerics.regressionPolynomial(deg, datax, curve.dataY);
var reg = brd.create('functiongraph',[regressionPolynomial],{strokeColor:'blue', strokeWidth:4});     
brd.create('glider',[100,30,reg],{strokeColor:'black'});     

t = brd.create('text',[20,40,
            function(){ return "r(x) = " + regressionPolynomial.getTerm();}
            ],
            {strokeColor:'black',fontSize:18});     
brd.unsuspendUpdate();