Difference between revisions of "Lissajous curves"

From JSXGraph Wiki
Jump to navigationJump to search
 
(14 intermediate revisions by one other user not shown)
Line 1: Line 1:
 
Lissajous curve (Lissajous figure or Bowditch curve) is the graph of the system of parametric equations
 
Lissajous curve (Lissajous figure or Bowditch curve) is the graph of the system of parametric equations
  
:<math>x=A\sin(at+\delta),\quad y=B\sin(bt),</math>
+
:<math>x=A\sin(at+\delta),\quad y=B\sin(bt).</math>
  
 
<jsxgraph board="brd" width="600" height="500">
 
<jsxgraph board="brd" width="600" height="500">
var brd = JXG.JSXGraph.initBoard('jxgbox',{axis:true,originX:300,originY:250,unitX:20,unitY:20});
+
var brd = JXG.JSXGraph.initBoard('jxgbox',{axis:true, boundingbox: [-12, 10, 12, -10]});
var a = brd.createElement('slider',[[2,8],[6,8],[0,3,6]]); brd.createElement('text',[1,8,'a']);
+
brd.suspendUpdate();
var b = brd.createElement('slider',[[2,7],[6,7],[0,2,6]]); brd.createElement('text',[1,7,'b']);
+
var a = brd.create('slider',[[2,8],[6,8],[0,3,6]],{name:'a'});  
var A = brd.createElement('slider',[[2,6],[6,6],[0,3,6]]); brd.createElement('text',[1,6,'A']);
+
var b = brd.create('slider',[[2,7],[6,7],[0,2,6]],{name:'b'});
var B = brd.createElement('slider',[[2,5],[6,5],[0,3,6]]); brd.createElement('text',[1,5,'B']);
+
var A = brd.create('slider',[[2,6],[6,6],[0,3,6]],{name:'A'});
var delta = brd.createElement('slider',[[2,4],[6,4],[0,0,Math.PI]]); brd.createElement('text',[1,4,'&delta;']);
+
var B = brd.create('slider',[[2,5],[6,5],[0,3,6]],{name:'B'});
 +
var delta = brd.create('slider',[[2,4],[6,4],[0,0,Math.PI]],{name:'&delta;'});  
  
var c = brd.createElement('curve',[
+
var c = brd.create('curve',[
 
           function(t){return A.Value()*Math.sin(a.Value()*t+delta.Value());},
 
           function(t){return A.Value()*Math.sin(a.Value()*t+delta.Value());},
 
           function(t){return B.Value()*Math.sin(b.Value()*t);},
 
           function(t){return B.Value()*Math.sin(b.Value()*t);},
           0, 2*Math.PI]);
+
           0, 2*Math.PI],{strokeColor:'#aa2233',strokeWidth:3});
 +
brd.unsuspendUpdate();
 
</jsxgraph>
 
</jsxgraph>
 +
 +
<source lang="javascript">
 +
var brd = JXG.JSXGraph.initBoard('jxgbox',{axis:true,boundingbox: [-12, 10, 12, -10]});
 +
brd.suspendUpdate();
 +
var a = brd.create('slider',[[2,8],[6,8],[0,3,6]],{name:'a'});
 +
var b = brd.create('slider',[[2,7],[6,7],[0,2,6]],{name:'b'});
 +
var A = brd.create('slider',[[2,6],[6,6],[0,3,6]],{name:'A'});
 +
var B = brd.create('slider',[[2,5],[6,5],[0,3,6]],{name:'B'});
 +
var delta = brd.create('slider',[[2,4],[6,4],[0,0,Math.PI]],{name:'&delta;'});
 +
 +
var c = brd.create('curve',[
 +
          function(t){return A.Value()*Math.sin(a.Value()*t+delta.Value());},
 +
          function(t){return B.Value()*Math.sin(b.Value()*t);},
 +
          0, 2*Math.PI],{strokeColor:'#aa2233',strokeWidth:3});
 +
brd.unsuspendUpdate();
 +
</source>
 +
 
[[Category:Examples]]
 
[[Category:Examples]]
 
[[Category:Curves]]
 
[[Category:Curves]]

Latest revision as of 10:32, 8 June 2011

Lissajous curve (Lissajous figure or Bowditch curve) is the graph of the system of parametric equations

[math]x=A\sin(at+\delta),\quad y=B\sin(bt).[/math]

var brd = JXG.JSXGraph.initBoard('jxgbox',{axis:true,boundingbox: [-12, 10, 12, -10]});
brd.suspendUpdate();
var a = brd.create('slider',[[2,8],[6,8],[0,3,6]],{name:'a'}); 
var b = brd.create('slider',[[2,7],[6,7],[0,2,6]],{name:'b'});
var A = brd.create('slider',[[2,6],[6,6],[0,3,6]],{name:'A'});
var B = brd.create('slider',[[2,5],[6,5],[0,3,6]],{name:'B'});
var delta = brd.create('slider',[[2,4],[6,4],[0,0,Math.PI]],{name:'&delta;'}); 

var c = brd.create('curve',[
          function(t){return A.Value()*Math.sin(a.Value()*t+delta.Value());},
          function(t){return B.Value()*Math.sin(b.Value()*t);},
          0, 2*Math.PI],{strokeColor:'#aa2233',strokeWidth:3});
brd.unsuspendUpdate();