Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Fetching contributors…

Cannot retrieve contributors at this time

150 lines (145 sloc) 7.534 kb
<!DOCTYPE html>
<html data-require="math graphie graphie-helpers graphie-geometry math-format">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Quadrilateral Angles</title>
<script src="../khan-exercise.js"></script>
<script>
</script>
</head>
<body>
<div class="exercise">
<div class="problems">
<div id="trapezoid">
<div class="vars">
<var id="ANGLES">randomQuadAngles.trapezoid()</var>
<var id="ANSWER_POS">randRange( 0, 3 )</var>
<var id="SHOWN_POS">ANSWER_POS % 2 === 0 ? ( ANSWER_POS + 3 ) % 4 : ( ANSWER_POS + 1 ) % 4</var>
<var id="ANG_LABELS">
function(){
var a = [ "", "","" ,"" ];
a[ ANSWER_POS ] = "x";
a[ SHOWN_POS ] = ANGLES[ SHOWN_POS ] + "^{\\circ}";
return a;
}()
</var>
</div>
<div class="problem">
What is the value of the angle marked with "x" ?
</div>
<div class="question">
<div class="graphie">
init({
range: [ [-1, 12 ], [ -8, -1 ] ]
})
var q = new Quadrilateral( [ 3.5, -7 ], ANGLES, randRange(0, 1 ) + 0.5, "", 3 );
q.boxOut( [ [ [ 0, -10 ], [ 0, 10 ] ] ], [ 0.7, 0 ] );
q.boxOut( [ [ [ 11, -10 ], [ 11, 10 ] ] ], [ -0.7, 0 ] );
q.draw();
q.labels = { "angles" : ANG_LABELS, "sides" : $.map( $.map( q.sides, lineLength ), function( x ){ return x.toFixed( 1 ); } ) };
q.drawLabels();
</div>
</div>
<div class="solution" data-type="multiple">
<span class="sol"><var>ANGLES[ ANSWER_POS ]</var></span><code>\Large {}^\circ</code>
</div>
<div class="hints">
<p>This figure is a trapezoid.</p>
<p>The angles of a trapezoid side are supplementary.</p>
<p><code><var>ANGLES[ SHOWN_POS ]</var> + x = 180</code></p>
<p><code>x = 180 - <var>ANGLES[ SHOWN_POS ]</var></code></p>
<p><code>x = <var>ANGLES[ ANSWER_POS ]</var></code></p>
</div>
</div>
<div id="isoscelesTrap1" data-type="trapezoid">
<div class="vars">
<var id="ANGLES">randomQuadAngles.isoscelesTrapezoid()</var>
</div>
</div>
<div id="isoscelesTrap2" data-type="trapezoid">
<div class="vars">
<var id="ANGLES">randomQuadAngles.isoscelesTrapezoid()</var>
<var id="SHOWN_POS">ANSWER_POS % 2 === 0 ? ( ANSWER_POS + 1 ) : ( ANSWER_POS - 1 )</var>
</div>
<div class="hints">
<p>This figure is an isosceles trapezoid.</p>
<p>The angles of bases of an isosceles trapezoid are equal.</p>
<p>Therefore, the angle x is also <code><var>ANGLES[ SHOWN_POS ]</var></code></p>
</div>
</div>
<div id="parallelogram1" data-type="trapezoid">
<div class="vars">
<var id="ANGLES">randomQuadAngles.parallelogram()</var>
<var id="SHOWN_POS">( ANSWER_POS + 2 ) % 4</var>
</div>
<div class="hints">
<p>This quadrilateral is a parallelogram.</p>
<p>Opposite angles of a parallelogram are equal.</p>
<p>Therefore, the angle x is also <code><var>ANGLES[ SHOWN_POS ]</var></code></p>
</div>
</div>
<div id="parallelogram2" data-type="trapezoid">
<div class="vars">
<var id="ANGLES">randomQuadAngles.parallelogram()</var>
<var id="SHOWN_POS">ANSWER_POS % 2 === 0 ? ( ANSWER_POS + 1 ) : ( ANSWER_POS - 1 )</var>
</div>
<div class="hints">
<p>This quadrilateral is a parallelogram.</p>
<p>Adjacent angles of a parallelogram are supplementary.</p>
<p><code><var>ANGLES[ SHOWN_POS ]</var> + x = 180</code></p>
<p><code>x = 180 - <var>ANGLES[ SHOWN_POS ]</var></code></p>
<p><code>x = <var>ANGLES[ ANSWER_POS ]</var></code></p>
</div>
</div>
<div id="rhombus1" data-type="parallelogram1">
<div class="vars">
<var id="ANGLES">randomQuadAngles.rhombus()</var>
</div>
<div class="question">
<div class="graphie">
init({
range: [ [-1, 13 ], [ -8, -1 ] ]
})
var q = new Quadrilateral( [ 3.5, -7 ], ANGLES, 1, "", 3 );
q.boxOut( [ [ [ 0, -10 ], [ 0, 10 ] ] ], [ 0.7, 0 ] );
q.boxOut( [ [ [ 12, -10 ], [ 12, 10 ] ] ], [ -0.7, 0 ] );
q.draw();
q.labels = { "angles" : ANG_LABELS, "sides" : $.map( $.map( q.sides, lineLength ), function( x ){ return x.toFixed( 1 ); } ) };
q.drawLabels();
</div>
</div>
<div class="hints">
<p>This quadrilateral is a rhombus, because it has all sides equal.</p>
<p>Opposite angles of a rhombus are equal.</p>
<p>Therefore, the angle x is also <code><var>ANGLES[ SHOWN_POS ]</var></code></p>
</div>
</div>
<div id="rhombus2" data-type="rhombus1">
<div class="vars">
<var id="ANGLES">randomQuadAngles.rhombus()</var>
<var id="SHOWN_POS">ANSWER_POS % 2 === 0 ? ( ANSWER_POS + 1 ) : ( ANSWER_POS - 1 )</var>
</div>
<div class="hints">
<p>This quadrilateral is a rhombus, because it has all sides equal.</p>
<p>Adjacent angles of a rhombus are supplementary.</p>
<p><code><var>ANGLES[ SHOWN_POS ]</var> + x = 180</code></p>
<p><code>x = 180 - <var>ANGLES[ SHOWN_POS ]</var></code></p>
<p><code>x = <var>ANGLES[ ANSWER_POS ]</var></code></p>
</div>
</div>
<div id="kite" data-type="rhombus1">
<div class="vars">
<var id="ANGLES">randomQuadAngles.kite()</var>
<var id="ANSWER_POS">randFromArray( [ 1, 3 ] )</var>
<var id="SHOWN_POS">( ANSWER_POS + 2 ) % 4</var>
</div>
<div class="hints">
<p>This quadrilateral is a kite, because it has two pairs of adjacent sides equal.</p>
<p>Angles between the non-equal sides of a kite are equal.</p>
<p>Therefore, the angle x is also <code><var>ANGLES[ SHOWN_POS ]</var></code></p>
</div>
</div>
</div>
</div>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.