Derivation of Parametric functions for hyperbola

						JXG.Options.text.useKatex = true;
JXG.Options.axis.ticks.majorHeight = 10;
JXG.Options.axis.ticks.insertTicks = false;
JXG.Options.axis.ticks.ticksDistance = 100;
var board = JXG.JSXGraph.initBoard('box1', {
boundingbox:[-10, 10, 10, -10],showNavigation:false, showcopyright: false, axis: true,
}); 

var F1 = board.create('point', [-4,0],{name:'',size:0});
var F2 = board.create('point', [function(){return -F1.X()},function(){return F1.Y();}],{name:'',size:0});
var C = board.create('point', [0,0],{name:'C',size:0,label:{offset:[-20,-15]}});
var el = board.create('hyperbola',[F1,F2,6]);
var c1 = board.create('circle', [[function(){return (F2.X()+F1.X())/2},function(){return F1.Y()}], 3],{strokeWidth:1});
var g1 = board.create('glider', [6.0, 3.5, el],{name:'P'});
var x1 =  board.create('point', [1,0],{visible:false});
var x2 =  board.create('point', [5,0],{visible:false});
var cx = board.create('line', [x1,x2],{visible:false});
var pp1 = board.create('perpendicularpoint', [g1, cx],{name:'A',size:0});
var t = board.create('tangent', [c1,pp1],{visible:false});
var i1 = board.create('intersection', [c1,t,0],{name:'B',size:0});
var l1 = board.create('segment', [pp1,i1],{strokeWidth:1});
var l2 = board.create('segment', [C,i1],{strokeWidth:1,withLabel:true,name:'a',label:{offset:[-10,10]}});
var l3 = board.create('segment', [g1,pp1],{strokeWidth:1});
var a1 = board.create('angle', [pp1, C, i1],{name:'t', radius:1.2,label:{offset:[-2,-12]}});
var i2 = board.create('intersection', [c1,cx,0],{name:'V_1',size:0,label:{offset:[5,-12]}});
var i3 = board.create('intersection', [c1,cx,1],{name:'V_2',size:0,label:{offset:[-25,-12]}});