var w,h,g,el,ratio,dragN,my={};function geomtriangleMain(imode){var version='0.912';my.mode=typeof imode!=='undefined'?imode:'type';var modes=['type','median','circum','incircle','ortho','area','perim','inequal','angles','choose']
w=360;h=280;var canvasid="canvas"+my.mode;my.titleid="title"+my.mode;my.infoid="info"+my.mode;my.anglesQ=true
var s='';s+=''
s+='
';s+='
';s+='
';s+='
';s+='
';s+='
© 2020 MathsIsFun.com v'+version+'
';s+='
';document.write(s);el=document.getElementById(canvasid);ratio=2;el.width=w*ratio;el.height=h*ratio;el.style.width=w+"px";el.style.height=h+"px";g=el.getContext("2d");g.setTransform(ratio,0,0,ratio,0,0);dragging=false;dragN=0;numShapes=3;shapes=[];tri=new Triangle();tri.setAllKnown(false);tri.setLabels("","","","","","");switch(my.mode){case "acute":case "equi":case "iso":case "obtuse":case "right":typ=mode;mode="type";break;default:typ="type";}
makeShapes();drawShapes();el.addEventListener("mousedown",onMouseDown,false);el.addEventListener('touchstart',ontouchstart,false);el.addEventListener("mousemove",dopointer,false);}
function update(){drawShapes();}
function toggleAngles(){my.anglesQ=!my.anglesQ;toggleBtn("anglesBtn",my.anglesQ);update();}
function toggleSides(){my.sidesQ=!my.sidesQ;toggleBtn("sidesBtn",my.sidesQ);update();}
function toggleBtn(btn,onq){if(onq){document.getElementById(btn).classList.add("hi");document.getElementById(btn).classList.remove("lo");}else{document.getElementById(btn).classList.add("lo");document.getElementById(btn).classList.remove("hi");}}
function reset(){makeShapes();update();}
function ontouchstart(evt){var touch=evt.targetTouches[0];evt.clientX=touch.clientX;evt.clientY=touch.clientY;evt.touchQ=true;onMouseDown(evt)}
function ontouchmove(evt){var touch=evt.targetTouches[0];evt.clientX=touch.clientX;evt.clientY=touch.clientY;evt.touchQ=true;onMouseMove(evt);evt.preventDefault();}
function ontouchend(){el.addEventListener('touchstart',ontouchstart,false);window.removeEventListener("touchend",ontouchend,false);if(dragging){dragging=false;window.removeEventListener("touchmove",ontouchmove,false);}}
function dopointer(evt){var bRect=el.getBoundingClientRect();var mouseX=(evt.clientX-bRect.left)*(el.width/ratio/bRect.width);var mouseY=(evt.clientY-bRect.top)*(el.height/ratio/bRect.height);var inQ=false;for(var i=0;ihighestIndex){dragHoldX=mouseX-shapes[i].x;dragHoldY=mouseY-shapes[i].y;highestIndex=i;dragN=i;}}}
if(dragging){if(evt.touchQ){window.addEventListener('touchmove',ontouchmove,false);}else{window.addEventListener("mousemove",onMouseMove,false);}}
if(evt.touchQ){el.removeEventListener("touchstart",ontouchstart,false);window.addEventListener("touchend",ontouchend,false);}else{el.removeEventListener("mousedown",onMouseDown,false);window.addEventListener("mouseup",onMouseUp,false);}
if(evt.preventDefault){evt.preventDefault();}
else if(evt.returnValue){evt.returnValue=false;}
return false;}
function onMouseUp(){el.addEventListener("mousedown",onMouseDown,false);window.removeEventListener("mouseup",onMouseUp,false);if(dragging){dragging=false;window.removeEventListener("mousemove",onMouseMove,false);}}
function onMouseMove(evt){var posX;var posY;var shapeRad=shapes[dragN].rad;var minX=shapeRad;var maxX=el.width-shapeRad;var minY=shapeRad;var maxY=el.height-shapeRad;var bRect=el.getBoundingClientRect();var mouseX=(evt.clientX-bRect.left)*(el.width/ratio/bRect.width);var mouseY=(evt.clientY-bRect.top)*(el.height/ratio/bRect.height);posX=mouseX-dragHoldX;posX=(posXmaxX)?maxX:posX);posY=mouseY-dragHoldY;posY=(posYmaxY)?maxY:posY);shapes[dragN].x=posX;shapes[dragN].y=posY;update();}
function hitTest(shape,mx,my){var dx;var dy;dx=mx-shape.x;dy=my-shape.y;return(dx*dx+dy*dy=Math.round(len1+len2)){}else{s+=len0.toString();s+=" is less than ";s+=len1.toString();s+=" + ";s+=len2.toString();s+=" = ";s+=Math.round(len1+len2).toString();}
document.getElementById(my.titleid).innerHTML=s;}
if(my.mode=='angles'){var angs=tri.getAngles()
tri.drawAngles(g);var s="";var okQ=true;for(i=0;i90)
angleAbove90=true;if(angs[i]==90)
angle90=true;if(angs[i]==angs[loop(i,0,2,1)]){angleSame=true;angleEqual=i;}
if(angs[i]!=60)
angleAll60=false;}
var descr='';var info='';if(angleAbove90){var descrColor='#ff0000';if(angleSame){descr="Obtuse Isosceles Triangle";info="Has an angle more than 90°, and also two equal angles and two equal sides";}else{descr="Obtuse Triangle";info="Has an angle more than 90°";}}else if(angle90){descrColor='#00aa00';if(angleSame){descr="Right Isosceles Triangle";info="Has a right angle (90°) and also two equal angles and two equal sides";}else{descr="Right Triangle";info="Has a right angle (90°)";}}else{descrColor='black';if(angleSame){if(angleAll60){descr="Equilateral Triangle";info="Three equal sides and three equal angles of 60° each";}else{descr="Acute Isosceles Triangle";info="All angles are less than 90° and has two equal sides and two equal angles";}}else{descr="Acute Triangle";info="All angles are less than 90°";}}
document.getElementById(my.titleid).innerHTML=descr;document.getElementById(my.titleid).style.color=descrColor;document.getElementById(my.infoid).innerHTML=info;if(angleZero){descr='Is that a Triangle?';info='An angle is Zero!';}}
if(my.mode=='choose'){var angs=tri.getAngles()
tri.drawAngles(g);var s="";var okQ=true;for(i=0;i90){d=30-(ang-90)/6;}else{}
g.fillStyle="rgba(0, 0, 255, 0.3)";g.beginPath();g.moveTo(pts[i].x,pts[i].y);g.arc(pts[i].x,pts[i].y,d,pts[i].angleIn,pts[i].angleOut,false);g.closePath();g.fill();}
var aMid=(pts[i].angleIn+pts[i].angleOut)/2;var txtPt=new Pt(0,0);txtPt.x=pts[i].x+(d+15)*Math.cos(aMid)-0;txtPt.y=pts[i].y+(d+15)*Math.sin(aMid)-0;g.textAlign='left';g.fillStyle="rgba(0, 0, 255, 1)";g.fillText(ang+"°",txtPt.x-10,txtPt.y+5,100);}};function drawPerpBisectors(){var lns=[];for(var i=0;i<3;i++){var ln=new Line(pts[i],pts[loop(i,0,2,1)]);var perpLn=ln.clone();perpLn.rotateMidMe(Math.PI/2);perpLn.setLen(1400);lns.push(perpLn);g.strokeStyle='black';g.lineWidth=1;g.beginPath();g.moveTo(perpLn.a.x,perpLn.a.y);g.lineTo(perpLn.b.x,perpLn.b.y);g.stroke();var midPt=ln.getMidPt();g.drawBox(midPt.x,midPt.y,15,perpLn.getAngle());}
return lns[0].getIntersection(lns[1]);}
function drawMedians(){var lns=[];for(var i=0;i<3;i++){var ln=new Line(pts[i],pts[loop(i,0,2,1)]);var midPt=ln.getMidPt();var medianLn=new Line(midPt,pts[loop(i+1,0,2,1)]);lns.push(medianLn);g.strokeStyle='black';g.lineWidth=1;g.beginPath();g.moveTo(medianLn.a.x,medianLn.a.y);g.lineTo(medianLn.b.x,medianLn.b.y);g.stroke();g.fillStyle='black';g.arc(midPt.x,midPt.y,2,0,2*Math.PI);g.fill();}
return lns[0].getIntersection(lns[1]);}
function drawOrthocenter(){var ln0=tri.drawAltitude(0,0,true,false);var ln1=tri.drawAltitude(0,1,true,false);var ln2=tri.drawAltitude(0,2,true,false);var iPt=ln0.getIntersection(ln1)
drawDot(iPt.x,iPt.y);g.setLineDash([5,15]);g.beginPath()
g.moveTo(ln0.b.x,ln0.b.y)
g.lineTo(iPt.x,iPt.y)
g.stroke()
g.beginPath()
g.moveTo(ln1.b.x,ln1.b.y)
g.lineTo(iPt.x,iPt.y)
g.stroke()
g.beginPath()
g.moveTo(ln2.b.x,ln2.b.y)
g.lineTo(iPt.x,iPt.y)
g.stroke()
g.setLineDash([]);return iPt;}
function drawAngleBisectors(){var lns=[];for(var i=0;i<3;i++){var ln=getAngleBisector(i);ln.setLen(1400);lns.push(ln);g.strokeStyle='black';g.lineWidth=1;g.beginPath();g.moveTo(ln.a.x,ln.a.y);g.lineTo(ln.b.x,ln.b.y);g.stroke();}
return lns[0].getIntersection(lns[1]);}
Triangle.prototype.getAltitude=function(ptNo){var aa=pts[loop(ptNo,0,2,1)];var ln=new Line(aa,pts[loop(ptNo,0,2,2)]);var iPt=ln.getClosestPoint(pts[ptNo]);var htLn=new Line(pts[ptNo],iPt);return Math.round(htLn.getLength()*scaleFactor);};Triangle.prototype.drawAltitude=function(r,ptNo,drawAsSegmentQ,showTextQ){drawAsSegmentQ=typeof drawAsSegmentQ!=='undefined'?drawAsSegmentQ:true;showTextQ=typeof showTextQ!=='undefined'?showTextQ:true;var ln=new Line(pts[loop(ptNo,0,2,1)],pts[loop(ptNo,0,2,2)]);var iPt=ln.getClosestPoint(pts[ptNo]);var htLn=new Line(pts[ptNo],iPt);g.strokeStyle='#0000ff';g.lineWidth=1;g.drawBox(htLn.b.x,htLn.b.y,10,htLn.getAngle()+Math.PI);if(showTextQ){var htMidPt=htLn.getMidPt();g.fillText(Math.round(htLn.getLength()*scaleFactor),htMidPt.x+2,htMidPt.y+10)}
var iSegPt=ln.getClosestPoint(pts[ptNo],true);var extendedLn=new Line(iSegPt,iPt);if(extendedLn.getLength()>20){extendedLn.setLen(extendedLn.getLength()-20);extendedLn.setLen(extendedLn.getLength()+30,false);g.beginPath();g.lineWidth=1;g.moveTo(extendedLn.a.x,extendedLn.a.y);g.lineTo(extendedLn.b.x,extendedLn.b.y);g.stroke();}
if(!drawAsSegmentQ)
htLn.setLen(1400);g.beginPath();g.lineWidth=1;g.moveTo(htLn.a.x,htLn.a.y);g.lineTo(htLn.b.x,htLn.b.y);g.stroke();return htLn;};Triangle.prototype.setDec=function(decimals){this.dec=decimals;};function getAngleBisector(i){var p=new Pt(pts[i].x,pts[i].y);var ln=new Line(new Pt(p.x,p.y),new Pt(p.x+100,p.y));var angle=-(pts[i].angleIn+pts[i].angleOut)/2;ln.rotatePtMe(p,angle);return ln;}
Triangle.prototype.getLength=function(n){var pt1=pts[n];var pt2=pts[loop(n,0,2,1)];var dx=pt2.x-pt1.x;var dy=pt2.y-pt1.y;return Math.sqrt(dx*dx+dy*dy)*scaleFactor;};Triangle.prototype.getPerimeter=function(){return this.getLength(0)+this.getLength(1)+this.getLength(2);};Triangle.prototype.getHeronArea=function(){var p=this.getPerimeter()/2;var heron=p;for(var i=0;i<3;i++){heron*=p-this.getLength(i);}
return Math.sqrt(heron);};Triangle.prototype.makeRegular=function(PointNum,midX,midY){var movedQ=true;var obj=shapes[PointNum];var radius=dist(midX-obj.x,midY-obj.y);var SttAngle=Math.atan2(obj.y-midY,obj.x-midX);var dAngle=Math.PI*2/3;for(var i=0;i<3;i++){obj=shapes[i];var angle=SttAngle+(i-PointNum)*dAngle;obj.x=midX+radius*Math.cos(angle);obj.y=midY+radius*Math.sin(angle);}
this.updateMe();return movedQ;};Triangle.prototype.makeScalene=function(PointNum){var movedQ=false;var pushDist=5;do{var shovedQ=false;this.fromPts(shapes);var angSum=0;var scaleneQ=true;var pushNum=0;for(var i=0;i<3;i++){var j=(i+1)%3;var ang1=Math.round(pts[i].getAngle()*180/Math.PI);var ang2=Math.round(pts[j].getAngle()*180/Math.PI);if(ang1==ang2){scaleneQ=false;pushNum=i;}
angSum+=ang1;}
if(angSum!=180)scaleneQ=false;if(!scaleneQ){while(pushNum==PointNum){pushNum=(Math.random()*3)<<0;}
shapes[pushNum].x+=getRandom(-pushDist,pushDist);shapes[pushNum].y+=getRandom(-pushDist,pushDist);shovedQ=true;}
if(shovedQ){movedQ=true;}}while(shovedQ);return movedQ;};Triangle.prototype.makeIsosceles=function(PointNum){var Aobj=shapes[2];var Bobj=shapes[1];var Cobj=shapes[0];this.fromPts(shapes);var movedQ=false;do{var Ox=(Bobj.x+Cobj.x)/2;var Oy=(Bobj.y+Cobj.y)/2;var angle=0;if(PointNum==0){angle=Math.atan2(Aobj.y-Oy,Aobj.x-Ox);}
if(PointNum==1){angle=Math.atan2(Bobj.y-Oy,Bobj.x-Ox)+Math.PI/2;}
if(PointNum==2){angle=Math.atan2(Cobj.y-Oy,Cobj.x-Ox)-Math.PI/2;}
var BO=dist(Bobj.x-Ox,Bobj.y-Oy);Bobj.x=Ox+BO*Math.cos(angle-Math.PI/2);Bobj.y=Oy+BO*Math.sin(angle-Math.PI/2);Cobj.x=Ox+BO*Math.cos(angle+Math.PI/2);Cobj.y=Oy+BO*Math.sin(angle+Math.PI/2);var AO=dist(Aobj.x-Ox,Aobj.y-Oy);Aobj.x=Ox+AO*Math.cos(angle);Aobj.y=Oy+AO*Math.sin(angle);this.fromPts(shapes);var shovedQ=false;var doubledAng=Math.round(pts[1].getAngle()*180/Math.PI);var pushDist=5;if(doubledAng==90){shapes[0].x+=getRandom(-pushDist,pushDist);shapes[0].y+=getRandom(-pushDist,pushDist);shovedQ=true;}
if(doubledAng==0){shapes[0].x+=getRandom(-pushDist,pushDist);shapes[0].y+=getRandom(-pushDist,pushDist);shovedQ=true;}
if(doubledAng==60){shapes[0].x+=getRandom(-pushDist,pushDist);shapes[0].y+=getRandom(-pushDist,pushDist);shovedQ=true;}
if(shovedQ)movedQ=true;}while(shovedQ);return movedQ;};Triangle.prototype.fromPts=function(srcPts){for(var i=0;i<3;i++){pts[i].x=srcPts[i].x;pts[i].y=srcPts[i].y;}
this.updateMe();};Triangle.prototype.makeRight=function(PointNum){var movedQ=true;this.fromPts(shapes);if(Math.round(pts[0].getAngle()*100)!=157){var ANum=0;var BNum=1;var CNum=2;var Aobj=shapes[ANum];var Bobj=shapes[BNum];var Cobj=shapes[CNum];var mult=1;if(PointNum==2){Bobj=shapes[2];Cobj=shapes[1];mult=-1;}
var Angle=Math.atan2(Aobj.y-Bobj.y,Aobj.x-Bobj.x);var AC=dist(Cobj.x-Aobj.x,Cobj.y-Aobj.y);Cobj.x=Aobj.x+AC*Math.cos(Angle-Math.PI/2)*mult;Cobj.y=Aobj.y+AC*Math.sin(Angle-Math.PI/2)*mult;}
this.updateMe();return movedQ;};Triangle.prototype.makeAcute=function(PointNum){var movedQ=false;this.fromPts(shapes);for(var i=0;i<3;i++){if(pts[i].getAngle()*180/Math.PI>89){var Aobj=shapes[i];var Bobj=shapes[(i+1)%3];var Cobj=shapes[(i+2)%3];var Angle=Math.atan2(Aobj.y-Bobj.y,Aobj.x-Bobj.x);var AC=dist(Cobj.x-Aobj.x,Cobj.y-Aobj.y);Cobj.x=Aobj.x+AC*Math.cos(Angle-Math.PI/2-0.02);Cobj.y=Aobj.y+AC*Math.sin(Angle-Math.PI/2-0.02);movedQ=true;this.updateMe();}}
return movedQ;};Triangle.prototype.makeObtuse=function(PointNum){var movedQ=false;this.fromPts(shapes);if(pts[0].getAngle()*180/Math.PI<91){var Aobj=shapes[0];var Bobj=shapes[1];var Cobj=shapes[2];var mult=1;if(PointNum==2){Bobj=shapes[2];Cobj=shapes[1];mult=-1;}
var Angle=Math.atan2(Aobj.y-Bobj.y,Aobj.x-Bobj.x);var AC=dist(Cobj.x-Aobj.x,Cobj.y-Aobj.y);Cobj.x=Aobj.x+AC*Math.cos(Angle-Math.PI/2+0.02*mult)*mult;Cobj.y=Aobj.y+AC*Math.sin(Angle-Math.PI/2+0.02*mult)*mult;movedQ=true;this.updateMe();}
return movedQ;};function Pt(ix,iy){this.x=ix;this.y=iy;var prevx;var prevy;var a;var prevQ=false;var validPtQ;angleIn=0;angleOut=0;}
Pt.prototype.setxy=function(ix,iy){this.x=ix;this.y=iy;validPtQ=true;};Pt.prototype.setPrevPt=function(){if(validPtQ){prevx=this.x;prevy=this.y;prevQ=true;}};Pt.prototype.getAngle=function(){return this.angleOut-this.angleIn;};Pt.prototype.drawMe=function(g){g.fillStyle="rgba(0, 0, 255, 0.3)";g.beginPath();g.arc(this.x,this.y,20,0,2*Math.PI,false);g.closePath();g.fill();};Pt.prototype.getAvg=function(pts){var xSum=0;var ySum=0;for(var i=0;ia2)
a2+=2*Math.PI;pt.angleIn=a1;pt.angleOut=a2;}}
function getClockwise(pts){var numPoints=pts.length;var count=0;for(var i=0;i0){count++;}}
if(count>0)
return(1);if(count==0)
return(0);return(-1);}
function getSides(pts){var numPoints=pts.length;var sides=[];for(var i=0;imaxNo){currNo=minNo+(currNo-minNo)%range;}
return currNo;}
function constrain(min,val,max){return(Math.min(Math.max(min,val),max));}
function Line(pt1,pt2){this.a=pt1;this.b=pt2;}
Line.prototype.getLength=function(n){var dx=this.b.x-this.a.x;var dy=this.b.y-this.a.y;return Math.sqrt(dx*dx+dy*dy)*scaleFactor;};Line.prototype.getIntersection=function(ln,asSegmentsQ){var A=this.a;var B=this.b;var E=ln.a;var F=ln.b;var a1=B.y-A.y;var b1=A.x-B.x;var c1=B.x*A.y-A.x*B.y;var a2=F.y-E.y;var b2=E.x-F.x;var c2=F.x*E.y-E.x*F.y;var denom=a1*b2-a2*b1;if(denom==0){return null;}
var ip=new Pt();ip.x=(b1*c2-b2*c1)/denom;ip.y=(a2*c1-a1*c2)/denom;if(asSegmentsQ){if(Math.pow(ip.x-B.x,2)+Math.pow(ip.y-B.y,2)>Math.pow(A.x-B.x,2)+Math.pow(A.y-B.y,2)){return null;}
if(Math.pow(ip.x-A.x,2)+Math.pow(ip.y-A.y,2)>Math.pow(A.x-B.x,2)+Math.pow(A.y-B.y,2)){return null;}
if(Math.pow(ip.x-F.x,2)+Math.pow(ip.y-F.y,2)>Math.pow(E.x-F.x,2)+Math.pow(E.y-F.y,2)){return null;}
if(Math.pow(ip.x-E.x,2)+Math.pow(ip.y-E.y,2)>Math.pow(E.x-F.x,2)+Math.pow(E.y-F.y,2)){return null;}}
return ip;};Line.prototype.getMidPt=function(){return new Pt((this.a.x+this.b.x)/2,(this.a.y+this.b.y)/2);};Line.prototype.rotateMidMe=function(angle){var midPt=this.getMidPt();this.a.translateMe(midPt,false);this.b.translateMe(midPt,false);this.a.rotateMe(angle);this.b.rotateMe(angle);this.a.translateMe(midPt);this.b.translateMe(midPt);};Line.prototype.rotatePtMe=function(pt,angle){this.a.x-=pt.x;this.a.y-=pt.y;this.b.x-=pt.x;this.b.y-=pt.y;this.a.rotateMe(angle);this.b.rotateMe(angle);this.a.x+=pt.x;this.a.y+=pt.y;this.b.x+=pt.x;this.b.y+=pt.y;};Line.prototype.getClosestPoint=function(toPt,inSegmentQ){var AP=toPt.translate(this.a,false);var AB=this.b.translate(this.a,false);var ab2=AB.x*AB.x+AB.y*AB.y;var ap_ab=AP.x*AB.x+AP.y*AB.y;var t=ap_ab/ab2;if(inSegmentQ){t=constrain(0,t,1);}
closest=this.a.translate(AB.multiply(t));return closest;};Line.prototype.setLen=function(newLen,fromMidQ){fromMidQ=typeof fromMidQ!=='undefined'?fromMidQ:true;var len=this.getLength();if(fromMidQ){var midPt=this.getMidPt();var halfPt=new Pt(this.a.x-midPt.x,this.a.y-midPt.y);halfPt.multiplyMe(newLen/len);this.a=midPt.translate(halfPt);this.b=midPt.translate(halfPt,false);}else{var diffPt=new Pt(this.a.x-this.b.x,this.a.y-this.b.y);diffPt.multiplyMe(newLen/len);this.b=this.a.translate(diffPt,false);}};Line.prototype.getAngle=function(){return Math.atan2(this.b.y-this.a.y,this.b.x-this.a.x);};Line.prototype.clone=function(){var ln=new Line(new Pt(0,0),new Pt(0,0));ln.a.x=this.a.x;ln.a.y=this.a.y;ln.b.x=this.b.x;ln.b.y=this.b.y;return ln;};CanvasRenderingContext2D.prototype.drawBox=function(midX,midY,radius,angle){g.beginPath();var pts=[[0,0],[Math.cos(angle),Math.sin(angle)],[Math.cos(angle)+Math.cos(angle+Math.PI/2),Math.sin(angle)+Math.sin(angle+Math.PI/2)],[Math.cos(angle+Math.PI/2),Math.sin(angle+Math.PI/2)],[0,0]];for(var i=0;i