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:[-2, 8, 8, -2],showNavigation:false, showcopyright: false, axis: true,
});
var p0 = board.create('point', [0, 0],{name:'O',size:0,fixed:true,label:{offset:[-20,-15]}});
var p1 = board.create('point', [3, 4],{fixed:true,size:0});
var px1 = board.create('point', [5, 0],{visible:false});
var px2 = board.create('point', [-5, 0],{visible:false});
var l1 = board.create('line', [px1,px2],{visible:false});
var g1 = board.create('glider', [3.36, 0, l1],{name:'P'});
var l2 = board.create('segment', [p1, g1]);
var l3 = board.create('segment', [p0, g1]);
var l4 = board.create('segment', [p0, p1]);
var txt2 = board.create('text',[1,7.5, function(){ return "AP = "+ l2.L().toFixed(1);}],{fontSize: 10});
var txt3= board.create('text',[1,6.5, function(){ return "OP = "+ l3.L().toFixed(1);}],{fontSize: 10});
var txt4 = board.create('text',[1,5.5, function(){ return "OA = "+ l4.L().toFixed(1);}],{fontSize: 10});
g1.off('drag');
strcolor = l1.getAttribute("strokeColor")
sides="";
g1.on('drag',function(){
if(parseInt(l2.L().toFixed(4))===parseInt(l3.L().toFixed(4))){
Init();
l2.setAttribute({strokeColor:"red"});
l3.setAttribute({strokeColor:"red"});
txt2.setAttribute({color:'red'})
txt3.setAttribute({color:'red'})
sides = "l2-l3";
}
if(parseInt(l3.L().toFixed(4))==parseInt(l4.L().toFixed(4))){
Init();
l3.setAttribute({strokeColor:"red"});
l4.setAttribute({strokeColor:"red"});
txt3.setAttribute({color:'red'})
txt4.setAttribute({color:'red'})
sides = "l3-l4";
}
if(parseInt(l2.L().toFixed(4))==parseInt(l4.L().toFixed(4))){
Init();
l2.setAttribute({strokeColor:"red"});
l4.setAttribute({strokeColor:"red"});
txt2.setAttribute({color:'red'})
txt4.setAttribute({color:'red'})
sides = "l2-l4";
}
function Init(){
l2.setAttribute({strokeColor: strcolor});
l3.setAttribute({strokeColor: strcolor});
l4.setAttribute({strokeColor: strcolor});
txt2.setAttribute({color:strcolor})
txt3.setAttribute({color:strcolor})
txt4.setAttribute({color:strcolor})
}
});
g1.on('up',function(){
// Init();
//alert(sides)
})