Tschirnhausen Cubic Catacaustic

From JSXGraph Wiki
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 Tschirnhausen cubic (black curve) is defined parametrically as

[math]\displaystyle{ x = a3(t^2-3) }[/math]
[math]\displaystyle{ y = at(t^2-3) }[/math]

Its catacaustic (red curve) with radiant point [math]\displaystyle{ (-8a,p) }[/math] is the semicubical parabola with parametric equations

[math]\displaystyle{ x = a6(t^2-1) }[/math]
[math]\displaystyle{ y = a4t^3 }[/math]

The catacaustic is the envelope of the rays reflected by the Tschirnhausen cubic. The ray's source is the radiant point.

You can get a feeling why the red curve is called envelope of the blue line if you drag the point of reflection.


The underlying JavaScript code

var brd = JXG.JSXGraph.initBoard('jxgbox',{boundingbox:[-10,10,10,-10], keepaspectratio:true, axis:true});
var a = brd.create('slider',[[-5,6],[5,6],[-5,1,5]], {name:'a'});

var cubic = brd.create('curve',
             [function(t){ return a.Value()*3*(t*t-3);},
              function(t){ return a.Value()*t*(t*t-3);},
              -5, 5
             {strokeWidth:1, strokeColor:'black'});

var radpoint = brd.create('point',[function(){ return -a.Value()*8;},0],{name:'radiant point'});
var reflectionpoint = brd.create('glider',[-7,1,cubic],{name:'point of reflection'});
var dir = brd.create('segment',[radpoint,reflectionpoint],{strokeWidth:1});
var infty = brd.create('point',
            var a = dir.stdform[1], b = dir.stdform[2],
                t = reflectionpoint.position,
                u = JXG.Math.Numerics.D(cubic.X)(t), 
                v = JXG.Math.Numerics.D(cubic.Y)(t),
                dirx = a*v*v-2*b*u*v-a*u*u,
                diry = b*u*u-2*a*u*v-b*v*v;
            return [0, diry, -dirx];  
     ],{name:'', visible:false});

var reflection = brd.create('line',
       {strokeWidth:1, straightFirst:false, trace:true});

var cataustic = brd.create('curve',
                 [function(t){ return a.Value()*6*(t*t-1);},
                  function(t){ return a.Value()*4*t*t*t;},
                 -4, 4
                 {strokeWidth:3, strokeColor:'red'});