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: false,
});
var F1 = board.create('point', [-6,0],{name:'F1',size:1, fixed:true, label:{offset:[-40,10]}});
var F2 = board.create('point', [function(){return -F1.X()},function(){return F1.Y();}],{name:'F2',size:1, label:{offset:[15, 10]}});
var p1 = board.create('point', [1,3],{name:'',size:0,fixed:true});
var el = board.create('ellipse',[F1,F2,p1],{strokeColor:'red'});
var g1 = board.create('glider', [2.0, 1.5, el],{name:'P',size:1});
var l1 = board.create('arrow', [F1, g1],{strokeWidth:1});
var l2 = board.create('arrow', [F2, g1],{strokeWidth:1});
var p2 = board.create('point', [function(){return F1.X()}, 2.0],{visible:false});
var l3 = board.create('axis', [F1, p2]);
var l3 = board.create('axis', [F1, F2]);
var a1 = board.create('angle', [F2, F1, g1],{name:'θ', radius:2,label:{offset:[5,12]}});
var txt1 = board.create('text',[4,-1,function(){return '2c';}])
var txt2 = board.create('text',[-2,2.1,function(){return 'r';}])