Circle approximation

From JSXGraph Wiki
Revision as of 09:48, 24 June 2009 by A WASSERMANN (talk | contribs)
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.

The underlying JavaScript code

var brd = JXG.JSXGraph.initBoard('box', {axis:true, originX: 300, originY: 300, grid:true, unitX: 50, unitY: 50});
var n = brd.createElement('slider',[[0,5],[3,5],[3,4,20]],{name:'n',snapWidth:1});

var p0 = brd.createElement('point',[0,0]);
var p1 = brd.createElement('point',[4,0]);
var circ = brd.createElement('circle',[p0,p1]);
var rot = brd.createElement('transform', [function() {return Math.PI*2.0/n.Value();},p0], {type:'rotate'});  // angle, rotation center
var ptmp = brd.createElement('point',[0,0],{visible:false,withLabel:false});  // dummy point for the rotation
var cOut = brd.createElement('curve',[[],[]],{fillColor:'#0033ff',highlightFillColor:'#0033ff',fillOpacity:0.5,highlightFillOpacity:0.5});
var cIn = brd.createElement('curve',[[],[]],{fillColor:'#ff3300',highlightFillColor:'#ff3300',fillOpacity:0.5,highlightFillOpacity:0.5});

cIn.updateDataArray = function() {
  var i;
  this.dataX = [p0.X()+circ.getRadius()];
  this.dataY = [p0.Y()];
  ptmp.setPositionDirectly(JXG.COORDS_BY_USER,p0.X()+circ.getRadius(),p0.Y());
  for (i=0;i<n.Value();i++) {
    rot.applyOnce(ptmp);
    this.dataX.push(ptmp.X());
    this.dataY.push(ptmp.Y());
  }
}

cOut.updateDataArray = function() {
  var i;
  var s = circ.getRadius()/Math.cos(Math.PI/n.Value());
  this.dataX = [p0.X()+s];
  this.dataY = [p0.Y()];
  ptmp.setPositionDirectly(JXG.COORDS_BY_USER, p0.X()+s,p0.Y());
  for (i=0;i<n.Value();i++) {
    rot.applyOnce(ptmp);
    this.dataX.push(ptmp.X());
    this.dataY.push(ptmp.Y());
  }
}

brd.update();