randRange(45, 75) randRange((180 - ANGLE1) / 2 - 15, (180 - ANGLE1) / 2 + 15) 180 - ANGLE1 - ANGLE2

Construct a circle inscribed inside the triangle.

init({ range: [[-5, 5], [-4, 4]], scale: 50 }); addMouseLayer(); addConstruction("construction"); graph.triangle = new Triangle([0, 0], [ANGLE1, ANGLE2, ANGLE3], 10, {}); graph.triangle.findRadii(); var circumCenter = graph.triangle.circumCenter; graph.triangle.rotate(randRange(0, 360)); graph.triangle.translate([-circumCenter[0], -circumCenter[1]]); graph.triangle.draw(); graph.inCenter = graph.triangle.inCenter; graph.points = graph.triangle.points;
Use the compass and straightedge tools to construct an inscribed circle.
getToolProperties(construction)
if (guess.length === 0) { return ""; } // Find incircle var inCircle = findCompass(guess, { radius: graph.triangle.inradius, cx: graph.inCenter[0], cy: graph.inCenter[1] }); if (inCircle.length < 1) { return false; } // Find at least two angle bisectors // These are lines that go through the center and one triangle point var lines = _.filter(guess, function(tool) { if (tool.first) { var line = [tool.first.coord, tool.second.coord]; if (!isPointOnLineSegment(line, graph.inCenter, 0.2)) { return false; } return _.any(graph.points, function(p) { return isPointOnLineSegment(line, p, 0.2) }); } }); if (lines.length < 2) { return "Make sure you keep the straightedges you used in place." } // Find compasses return true;
showConstructionGuess(guess);

An inscribed circle is centered on the incenter of a triangle and touches all three sides.

The incenter of a triangle is the intersection of its angle bisectors.

// Radius of compasses we use for angle bisector construction graph.r = 1.2; var angle1 = atan2(graph.points[1][1] - graph.points[0][1], graph.points[1][0] - graph.points[0][0]); var angle2 = atan2(graph.points[2][1] - graph.points[0][1], graph.points[2][0] - graph.points[0][0]); graph.p1 = [ graph.points[0][0] + graph.r * cos(angle1), graph.points[0][1] + graph.r * sin(angle1) ]; graph.p2 = [ graph.points[0][0] + graph.r * cos(angle2), graph.points[0][1] + graph.r * sin(angle2) ]; circle(graph.points[0], 0.08, { fill: GRAY, stroke: null }); circle(graph.p1, 0.08, { fill: GRAY, stroke: null }); circle(graph.p2, 0.08, { fill: GRAY, stroke: null }); circle(graph.points[0], graph.r, { stroke: GRAY, strokeWidth: 1, fill: "none", strokeDasharray: "- " }).toBack(); graph.hintLines = raphael.set(); graph.hintLines.push(drawHintLine(graph.points[0], graph.p1, 1)); graph.hintLines.push(drawHintLine(graph.points[0], graph.p2, 1)); graph.hintLines.toBack();

If we put a compass on one point of the triangle we can find points on either side which are the same distance from that point.

// Find where compasses intersect graph.bisect1 = atan2(graph.inCenter[1] - graph.points[0][1], graph.inCenter[0] - graph.points[0][0]); // Length is base of two triangles with one angle half the triangle's angle var length = 2 * graph.r * cos(ANGLE1 * PI / 360); var bisector1 = [ graph.points[0][0] + length * cos(graph.bisect1), graph.points[0][1] + length * sin(graph.bisect1) ]; circle(graph.p1, graph.r, { stroke: GRAY, strokeWidth: 1, fill: "none", strokeDasharray: "- " }).toBack(); circle(graph.p2, graph.r, { stroke: GRAY, strokeWidth: 1, fill: "none", strokeDasharray: "- " }).toBack(); graph.hintLines.push(drawHintLine(graph.p1, bisector1, 1)); graph.hintLines.push(drawHintLine(graph.p2, bisector1, 1));

If we put compasses with the same radii on each of these new points, we can find all the points that are an equal distance from both points.

var x1 = graph.points[0][0] + 10 * cos(graph.bisect1); var y1 = graph.points[0][1] + 10 * sin(graph.bisect1); var x2 = graph.points[0][0] - 10 * cos(graph.bisect1); var y2 = graph.points[0][1] - 10 * sin(graph.bisect1); line([x1, y1], [x2, y2], { strokeWidth: 1, strokeDasharray: "- ", stroke: GRAY, }).toBack();

Joining the triangle angle with the point where the compasses intersect creates two triangles with the same side lengths and therefore the same angles. This line therefore bisects the angle.

graph.hintLines.remove(); var angle1 = atan2(graph.points[0][1] - graph.points[1][1], graph.points[0][0] - graph.points[1][0]); var angle2 = atan2(graph.points[2][1] - graph.points[1][1], graph.points[2][0] - graph.points[1][0]); var p1 = [ graph.points[1][0] + graph.r * cos(angle1), graph.points[1][1] + graph.r * sin(angle1) ]; var p2 = [ graph.points[1][0] + graph.r * cos(angle2), graph.points[1][1] + graph.r * sin(angle2) ]; circle(graph.points[1], 0.08, { fill: GRAY, stroke: null }) circle(p1, 0.08, { fill: GRAY, stroke: null }) circle(p2, 0.08, { fill: GRAY, stroke: null }) circle(graph.points[1], graph.r, { stroke: GRAY, strokeWidth: 1, fill: "none", strokeDasharray: "- " }).toBack(); circle(p1, graph.r, { stroke: GRAY, strokeWidth: 1, fill: "none", strokeDasharray: "- " }).toBack(); circle(p2, graph.r, { stroke: GRAY, strokeWidth: 1, fill: "none", strokeDasharray: "- " }).toBack(); var angle3 = atan2(graph.inCenter[1] - graph.points[1][1], graph.inCenter[0] - graph.points[1][0]); var x1 = graph.points[1][0] + 10 * cos(angle3); var y1 = graph.points[1][1] + 10 * sin(angle3); var x2 = graph.points[1][0] - 10 * cos(angle3); var y2 = graph.points[1][1] - 10 * sin(angle3); line([x1, y1], [x2, y2], { strokeWidth: 1, strokeDasharray: "- ", stroke: GRAY, }).toBack();

Using the same method we can bisect another of the triangle's angles.

circle(graph.inCenter, 0.08, { fill: GRAY, stroke: null }) circle(graph.inCenter, graph.triangle.inradius, { stroke: GRAY, strokeWidth: 2, fill: "none" }).toBack();

The point where the bisectors intersect is the incenter. We could bisect the third angle in the triangle, but this will intersect at the same point.

We can draw an inscribed circle by centering a compass on the incenter and changing its radius so it touches the sides of the triangle.

Construct a circle circumscribing the triangle.

init({ range: [[-5, 5], [-4, 4]], scale: 50 }); addMouseLayer(); addConstruction("construction"); graph.triangle = new Triangle([0, 0], [ANGLE1, ANGLE2, ANGLE3], 10, {}); graph.triangle.findRadii(); graph.triangle.rotate(randRange(0, 360)); graph.center = graph.triangle.circumCenter; graph.triangle.translate([-graph.center[0], -graph.center[1]]); graph.triangle.draw(); graph.points = graph.triangle.points; graph.midpoints = [ [(graph.points[0][0] + graph.points[1][0]) / 2, (graph.points[0][1] + graph.points[1][1]) / 2], [(graph.points[1][0] + graph.points[2][0]) / 2, (graph.points[1][1] + graph.points[2][1]) / 2], [(graph.points[2][0] + graph.points[0][0]) / 2, (graph.points[2][1] + graph.points[0][1]) / 2] ]; //addDummyPoint([0, 0]);
Use the compass and straightedge tools to construct a circle circumscribing the triangle.
getToolProperties(construction)
if (guess.length === 0) { return ""; } // Find circumcircle var circumCircle = findCompass(guess, { radius: graph.triangle.circumradius, cx: 0, cy: 0 }); if (circumCircle.length < 1) { return false; } // Find at least two perpendicular bisectors // These are lines that go through the center and the mid-point of a side var lines = _.filter(guess, function(tool) { if (tool.first) { var line = [tool.first.coord, tool.second.coord]; if (!isPointOnLineSegment(line, [0, 0], 0.5)) { return false; } return _.any(graph.midpoints, function(p) { return isPointOnLineSegment(line, p, 0.5) }); } }); if (lines.length < 2) { return "Make sure you keep the straightedges you used in place." } // Find compasses return true;
showConstructionGuess(guess);

A circle that circumscribes a triangle is centered on the circumcenter of a triangle and touches all three vertices.

The circumcenter of a triangle is at the intersection of the perpendicular bisectors of its sides.

var r = graph.triangle.sideLengths[0] / sqrt(3); circle(graph.points[0], 0.08, { fill: GRAY, stroke: null }); circle(graph.points[1], 0.08, { fill: GRAY, stroke: null }); circle(graph.points[0], r, { stroke: GRAY, strokeWidth: 1, fill: "none", strokeDasharray: "- " }).toBack(); circle(graph.points[1], r, { stroke: GRAY, strokeWidth: 1, fill: "none", strokeDasharray: "- " }).toBack(); var angle = atan2(graph.points[0][1] - graph.points[1][1], graph.points[0][0] - graph.points[1][0]); angle += PI / 2; graph.intersect1 = [ graph.midpoints[0][0] + r / 2 * cos(angle), graph.midpoints[0][1] + r / 2 * sin(angle) ]; graph.intersect2 = [ graph.midpoints[0][0] - r / 2 * cos(angle), graph.midpoints[0][1] - r / 2 * sin(angle) ]; graph.hintLines = raphael.set(); graph.hintLines.push(drawHintLine(graph.points[0], graph.intersect1, 1)); graph.hintLines.push(drawHintLine(graph.points[1], graph.intersect1, 1)); graph.hintLines.push(drawHintLine(graph.points[0], graph.intersect2, 1)); graph.hintLines.push(drawHintLine(graph.points[1], graph.intersect2, 1)); graph.hintLines.toBack();

If we put two compasses of the same size on two points we can find four lines of the same length.

var angle = atan2(graph.midpoints[0][1], graph.midpoints[0][0]); var x1 = graph.midpoints[0][0] + 10 * cos(angle); var y1 = graph.midpoints[0][1] + 10 * sin(angle); var x2 = graph.midpoints[0][0] - 10 * cos(angle); var y2 = graph.midpoints[0][1] - 10 * sin(angle); graph.hintLines.push(circle(graph.intersect1, 0.08, { fill: GRAY, stroke: null })); graph.hintLines.push(circle(graph.intersect2, 0.08, { fill: GRAY, stroke: null })); rect() line([x1, y1], [x2, y2], { strokeWidth: 1, stroke: GRAY, strokeDasharray: "- " }).toBack();

Drawing a straightedge through the two points where the compasses intersect creates two similar triangles and so must bisect the side perpendicularly.

graph.hintLines.remove(); var angle = atan2(graph.midpoints[1][1], graph.midpoints[1][0]); var x1 = graph.midpoints[1][0] + 10 * cos(angle); var y1 = graph.midpoints[1][1] + 10 * sin(angle); var x2 = graph.midpoints[1][0] - 10 * cos(angle); var y2 = graph.midpoints[1][1] - 10 * sin(angle); line([x1, y1], [x2, y2], { strokeWidth: 1, stroke: GRAY, strokeDasharray: "- " }).toBack();

By the same logic, we can construct a perpendicular bisector of another side.

circle([0, 0], 0.08, { fill: GRAY, stroke: null }) circle([0, 0], graph.triangle.circumradius, { stroke: GRAY, strokeWidth: 2, fill: "none" }).toBack();

The point where the bisectors intersect is the circumcenter. We could construct a perpendicular bisector of the third side in the triangle, but this will intersect at the same point.

We can circumscribe the triangle by centering a compass on the circumcenter and changing its radius so it touches the vertices of the triangle.