This repository has been archived by the owner on May 11, 2021. It is now read-only.
/
dividing_fractions.html
60 lines (51 loc) · 2.17 KB
/
dividing_fractions.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<!DOCTYPE html>
<html data-require="math math-format graphie">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Dividing whole numbers by fractions</title>
<script src="../khan-exercise.js"></script>
</head>
<body>
<div class="exercise">
<div class="vars">
<var id="INTEGER">randRange(2, 8)</var>
<var id="DENOMINATOR">randRange(2, 9)</var>
</div>
<div class="problems">
<div>
<div class="question"><p><code>\large{<var>INTEGER</var> \div \dfrac{1}{<var>DENOMINATOR</var>} = {?}}</code></p></div>
<div class="solution" data-type="rational"><var>DENOMINATOR * INTEGER</var></div>
</div>
</div>
<div class="hints">
<div>
<p>Imagine we have <code>\blue{<var>INTEGER</var>}</code> objects and divide them each into pieces <code>\dfrac{1}{<var>DENOMINATOR</var>}</code> of the size.</p>
<div class="graphie" id="fraction">
var h = ceil(INTEGER / 4);
init({
range: [[0, 4], [0, h]],
scale: 90
});
var x = 0.5;
var y = 0.5;
var r = 0.45;
var p = Math.PI * 2 / DENOMINATOR;
for (var i=0; i < INTEGER; i++) {
circle([x, y], r, {fill: BLUE, stroke: "none"});
for (var j=0; j < DENOMINATOR; j++) {
line([x, y], [x + r * Math.sin(j * p), y + r * Math.cos(j * p)], {stroke: KhanUtil.BACKGROUND});
}
x++;
if (x > INTEGER / h) {
x = 0.5;
y++;
}
}
</div>
</div>
<p>In total we have <code><var>INTEGER</var> \times <var>DENOMINATOR</var></code> pieces.</p>
<p><code><var>INTEGER</var> \times <var>DENOMINATOR</var> = <var>INTEGER * DENOMINATOR</var></code></p>
</div>
</div>
</body>
</html>