α-wwwiki

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

editor : alpha [82.255.186.154] 2013/09/22 09:33:31
_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 First, 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, ... ]

function pL3 ( N ) { // a parabola using the pForms approach
  var pl3 = [ {x:-0.5, y:-0.0},
              {x: 0.0, y: 1.0},
              {x: 0.5, y:-0.5} ]
  return PF.build( pl3, N );
}

function pL4 ( N ) { // a cubic using the pForms approach
  var pl4 = [ {x:-0.5, y:-0.5},
              {x:-0.2, y: 1.0},
              {x: 0.2, y:-0.5},
              {x: 0.5, y: 0.5} ]
  return PF.build( pl4, N );
}

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

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

// 1) function form : y = f(x)
  if (choix == 1)
    return build( seg, [1/2, 0], [-0.45, 0.45], 30 ); 
  else if (choix == 2)
    return build( par, [4, 0, -0.5], [-0.25, 0.5], 30 ); 
  else if (choix == 3)
    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)
    return cercle( 0.5, 30 );

// 3) poles controlled forms : pF = [ p0, p1, p2, ... ]
  else if (choix == 5)
    return pL3( 6 )
  else if (choix == 6)
    return pL4( 6 )
  else
    return "nada"
}

°°}}