α-wwwiki

α-wwwiki :: history/math_curves/20130922-095043.txt

editor : alpha [82.255.186.154] 2013/09/22 09:50:43
_h1 math Curves

_p I begin the study of an interface for {u defining and drawing elementary math curves}. It's a work in progress, a first exploration ! Have a look to the page [[pForms]] for more complex 3D geometry (surfaces, volumes, Nurbs,...).

{div {@ style="position:relative;"}
  {canvas 
    {@ id="mycanvas" 
       width="600" 
       height="600" 
       style="background:#ffe; border:1px dashed black; 
       box-shadow:0 0 8px black;"
} } }

{p {b First, and once} {input {@ type="submit" value="include lambda3D" onclick="°°
var js = document.createElement('script');
js.src = 'plugins/lambda3D.js';
document.body.appendChild( js );
this.value = 'OK, lambda3D is included !';
this.disabled='disabled';

°°"}}
then play with the math editor and
{input {@ type="submit" value="draw" onclick="°°

var js = document.createElement('script');
var input = getId('code').value;
js.innerHTML = decode_html_entities(input); // < ,>
document.head.appendChild( js );

°°"}}.}
_p Today, three types of curves are shown :
_ul curves defined by a polynomial expression y = Σ a{sub i}.x{sup i}, for instance a segment, a parabola and a cubic,
_ul parametric curves, for instance a circle x=r.cos(t), y=r.sin(t)
_ul poles controlled curves, for instance a parabola, a cubic.
_p The frame at the right can be edited and the result viewed when clicking the button "draw", but the modifications in this frame are not saved when the page is closed, so copy/paste your work before.
_p Should you like some explanations ?

{div {@ style="position:absolute; top:10px; left:600px;opacity:0.8"}{drag}{textarea {@ id="code" style="width:500px;height:800px;padding:5px;"}°°

// 1) function form : y = polynom(x)

function seg(k, x) { 
 return k[0]*x + x[1] 
}
function par(k, x) { 
 return k[0]*x*x + k[1]*x +k[2] 
}
function cub(k, x) { 
 return k[0]*x*x*x + k[1]*x*x +k[2]*x + k[3] 
}

// 2) parametric form : x=x(t), y=y(t)

// 3) poles controlled forms : pF = [ p0, p1, p2, ... ]
// the stuff is defined in the file plugins/lambda3D.js. 
// Have a look

/////////////////////////////////////////////////////////////
function courbe () { // don't change the name of this function !

var choix = 6; // here is the choice to do : 1,2,3,4,5,6

// 1) function form : y = f(x)
  if (choix == 1)      // a segment
    return build( seg, [1/2, 0], [-0.45, 0.45], 30 ); 
  else if (choix == 2) // a parabola (degree 2 polynom)
    return build( par, [4, 0, -0.5], [-0.25, 0.5], 30 ); 
  else if (choix == 3) // a cubic (degree 3 polynom)
    return build( cub, [12, 4, 0, -0.2], [-0.5, 0.5], 50 );

// 2) parametric form : x=x(t), y=y(t)
  else if (choix == 4) // a circle with radius = 0.5
    return cercle( 0.5, 30 );

// 3) poles controlled forms : pF = [ p0, p1, p2, ... ]
  else if (choix == 5) // a parabola controlled by 3 points
    return PF.build([{x:-0.5,y:-0.0},{x:0.0,y:1.0},{x:0.5,y:-0.5}],6);
  else if (choix == 6)
    return PF.build(   // a cubic controlled by 4 points
    [{x:-0.5,y:-0.5},{x:-0.2,y:1.0},{x: 0.2,y:-0.5},{x: 0.5,y:0.5}],6);
  else
    return "nada"
}

°°}}