Skip to content
Fetching contributors…
Cannot retrieve contributors at this time
429 lines (391 sloc) 25.7 KB
<!DOCTYPE html>
<html data-require="math graphie graphie-helpers word-problems">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Multiplying fractions word problems</title>
<script src="../khan-exercise.js"></script>
</head>
<body>
<div class="exercise">
<div class="problems">
<div id="birthday-party-guests">
<div class="vars" data-ensure="isInt( SOLUTION ) && getGCD( D, N ) === 1">
<var id="D">randFromArray([ 5, 8 ])</var>
<var id="N">randRange( 3, D - 1 )</var>
<var id="INVITEES">randRange( 1, 5 ) * D</var>
<var id="SOLUTION">N / D * INVITEES</var>
</div>
<p class="problem">
<var>person( 1 )</var> invited <var>INVITEES</var> friends to <var>his( 1 )</var> birthday party. Some people
had other plans and could not attend, but <code>\frac{<var>N</var>}{<var>D</var>}</code> of the people <var>person( 1 )</var>
invited were able to attend.
</p>
<p class="question">How many people went to <var>person( 1 )</var>'s birthday party?</p>
<div class="solution" data-type="multiple">
<span style="padding-right: 5px" class="sol" data-forms="integer"><var>SOLUTION</var></span> people
</div>
<div class="hints">
<p>
We need to figure out what <code>\dfrac{<var>N</var>}{<var>D</var>}</code> of <code><var>INVITEES</var></code> is to find out
how many people attended the party.
</p>
<p>
We can find <code>\dfrac{<var>N</var>}{<var>D</var>}</code> of <code><var>INVITEES</var></code> by multiplying
<code class="hint_blue">\dfrac{<var>N</var>}{<var>D</var>}</code> and <code class="hint_orange"><var>INVITEES</var></code>.
</p>
<p><code>
\color{<var>BLUE</var>}{\dfrac{<var>N</var>}{<var>D</var>}} \times \color{<var>ORANGE</var>}{<var>INVITEES</var>} =
\color{<var>GREEN</var>}{\text{?}}
</code></p>
<p><code>
\color{<var>BLUE</var>}{\dfrac{<var>N</var>}{<var>D</var>}} \times \color{<var>ORANGE</var>}{\dfrac{<var>INVITEES</var>}{1}} =
\dfrac{\color{<var>BLUE</var>}{<var>N</var>} \cdot \color{<var>ORANGE</var>}{<var>INVITEES</var>}}
{\color{<var>BLUE</var>}{<var>D</var>} \cdot \color{<var>ORANGE</var>}{1}} = \color{<var>GREEN</var>}{\text{?}}
</code></p>
<p><code>
\dfrac{\color{<var>BLUE</var>}{<var>N</var>} \cdot \color{<var>ORANGE</var>}{<var>INVITEES</var>}}
{\color{<var>BLUE</var>}{<var>D</var>}} = \color{<var>GREEN</var>}{\dfrac{<var>N * INVITEES</var>}{<var>D</var>}} =
\color{<var>GREEN</var>}{<var>SOLUTION</var>}
</code></p>
<div>
<p>
We can also visually see that <code class="hint_blue">\dfrac{<var>N</var>}{<var>D</var>}</code> of
<code class="hint_orange"><var>INVITEES</var></code> is <code class="hint_green"><var>SOLUTION</var></code>:
</p>
<div class="graphie">
init({ range: [ [ -0.05, 1 ], [ 0, 3 ] ],scale: [ 450, 30 ] });
rectchart( [ N, D - N ], [ BLUE, "#ccc" ], 2 );
rectchart( [ INVITEES, 0 ], [ ORANGE, "#999" ], 1 );
rectchart( [ SOLUTION, INVITEES - SOLUTION ], [ GREEN, BACKGROUND ], 0 );
style({ color: BLUE }, function() {
label([ 0, 2.5 ], "\\frac{" + N + "}{" + D + "}", "left" );
});
style({ color: ORANGE }, function() {
label([ 0, 1.5 ], INVITEES, "left" );
});
style({ color: GREEN }, function() {
label([ 0, 0.5 ], SOLUTION, "left" );
});
</div>
</div>
<p><strong><var>SOLUTION</var> people attended <var>person( 1 )</var>'s party.</strong></p>
</div>
</div>
<div id="bookstore-spending">
<div class="vars" data-ensure="isInt ( SOLUTION ) && getGCD( D, N ) === 1">
<var id="AMOUNT">(randRange( 2, 10 )*D)</var>
<var id="D">randFromArray([ 2, 8 ])</var>
<var id="N">randRange( 1, D - 1 )</var>
<var id="SOLUTION">N / D * AMOUNT</var>
</div>
<p class="problem">
After saving up for a while, <var>person( 1 )</var> had $<var>AMOUNT</var>.00 in
<var>his( 1 )</var> piggy bank, and <var>he( 1 )</var> spent
<code>\frac{<var>N</var>}{<var>D</var>}</code> of that money on books at the bookstore.
</p>
<p class="question">How much money did <var>person( 1 )</var> spend?</p>
<div class="solution" data-forms="dollar"><var>SOLUTION</var></div>
<div class="hints">
<p>
We need to figure out what <code>\dfrac{<var>N</var>}{<var>D</var>}</code> of <code>$<var>AMOUNT</var>.00</code> is to find out
how much <var>person(1)</var> spent.
</p>
<p>
We can find <code>\dfrac{<var>N</var>}{<var>D</var>}</code> of <code>$<var>AMOUNT</var>.00</code> by multiplying
<code class="hint_blue">\dfrac{<var>N</var>}{<var>D</var>}</code> and <code class="hint_orange"><var>AMOUNT</var></code>.
</p>
<p><code>
\color{<var>BLUE</var>}{\dfrac{<var>N</var>}{<var>D</var>}} \times \color{<var>ORANGE</var>}{<var>AMOUNT</var>} =
\color{<var>GREEN</var>}{\text{?}}
</code></p>
<p><code>
\color{<var>BLUE</var>}{\dfrac{<var>N</var>}{<var>D</var>}} \times \color{<var>ORANGE</var>}{\dfrac{<var>AMOUNT</var>}{1}} =
\dfrac{\color{<var>BLUE</var>}{<var>N</var>} \cdot \color{<var>ORANGE</var>}{<var>AMOUNT</var>}}
{\color{<var>BLUE</var>}{<var>D</var>} \cdot \color{<var>ORANGE</var>}{1}} = \color{<var>GREEN</var>}{\text{?}}
</code></p>
<p><code>
\dfrac{\color{<var>BLUE</var>}{<var>N</var>} \cdot \color{<var>ORANGE</var>}{<var>AMOUNT</var>}}
{\color{<var>BLUE</var>}{<var>D</var>}} = \color{<var>GREEN</var>}{\dfrac{<var>N * AMOUNT</var>}{<var>D</var>}} =
\color{<var>GREEN</var>}{<var>SOLUTION</var>}
</code></p>
<div>
<p>
We can also visually see that <code class="hint_blue">\dfrac{<var>N</var>}{<var>D</var>}</code> of
<code class="hint_orange"><var>AMOUNT</var></code> is <code class="hint_green"><var>SOLUTION</var></code>:
</p>
<div class="graphie">
init({ range: [ [ -0.05, 1 ], [ 0, 3 ] ],scale: [ 450, 30 ] });
rectchart( [ N, D - N ], [ BLUE, "#ccc" ], 2 );
rectchart( [ AMOUNT, 0 ], [ ORANGE, "#999" ], 1 );
rectchart( [ SOLUTION, AMOUNT - SOLUTION ], [ GREEN, BACKGROUND ], 0 );
style({ color: BLUE }, function() {
label([ 0, 2.5 ], "\\frac{" + N + "}{" + D + "}", "left" );
});
style({ color: ORANGE }, function() {
label([ 0, 1.5 ], AMOUNT, "left" );
});
style({ color: GREEN }, function() {
label([ 0, 0.5 ], SOLUTION, "left" );
});
</div>
</div>
<p><strong><var>person( 1 )</var> spent $<var>SOLUTION</var>.00 on books.</strong></p>
</div>
</div>
<div id="canned-food-spending">
<div class="vars" data-ensure="isInt ( SOLUTION ) && getGCD( D, N ) === 1">
<var id="AMOUNT">(randRange( 2, 10 )*D)</var>
<var id="D">randFromArray([ 8, 6 ])</var>
<var id="N">randRange( 1, D - 1 )</var>
<var id="SOLUTION">roundTo( 2, N / D * AMOUNT )</var>
</div>
<p class="problem">
Every day <var>person( 1 )</var> put the extra change from <var>his( 1 )</var> pockets into a glass jar. After
<var>randRange( 10, 30 )</var> weeks, <var>he( 1 )</var> had saved up $<var>AMOUNT</var>.00. <var>person( 1 )</var>
decided to use <code>\frac{<var>N</var>}{<var>D</var>}</code> of the money from the jar to buy canned food for a homeless shelter.
</p>
<p class="question">How much money did <var>person( 1 )</var> spend on canned food?</p>
<div class="solution" data-forms="dollar"><var>SOLUTION</var></div>
<div class="hints">
<p>
We need to figure out what <code>\dfrac{<var>N</var>}{<var>D</var>}</code> of <code>$<var>AMOUNT</var>.00</code> is to find out
how much <var>person(1)</var> spent.
</p>
<p>
We can find <code>\dfrac{<var>N</var>}{<var>D</var>}</code> of <code>$<var>AMOUNT</var>.00</code> by multiplying
<code class="hint_blue">\dfrac{<var>N</var>}{<var>D</var>}</code> and <code class="hint_orange"><var>AMOUNT</var></code>.
</p>
<p><code>
\color{<var>BLUE</var>}{\dfrac{<var>N</var>}{<var>D</var>}} \times \color{<var>ORANGE</var>}{<var>AMOUNT</var>} =
\color{<var>GREEN</var>}{\text{?}}
</code></p>
<p><code>
\color{<var>BLUE</var>}{\dfrac{<var>N</var>}{<var>D</var>}} \times \color{<var>ORANGE</var>}{\dfrac{<var>AMOUNT</var>}{1}} =
\dfrac{\color{<var>BLUE</var>}{<var>N</var>} \cdot \color{<var>ORANGE</var>}{<var>AMOUNT</var>}}
{\color{<var>BLUE</var>}{<var>D</var>} \cdot \color{<var>ORANGE</var>}{1}} = \color{<var>GREEN</var>}{\text{?}}
</code></p>
<p><code>
\dfrac{\color{<var>BLUE</var>}{<var>N</var>} \cdot \color{<var>ORANGE</var>}{<var>AMOUNT</var>}}
{\color{<var>BLUE</var>}{<var>D</var>}} = \color{<var>GREEN</var>}{\dfrac{<var>N * AMOUNT</var>}{<var>D</var>}} =
\color{<var>GREEN</var>}{<var>SOLUTION</var>}
</code></p>
<div>
<p>
We can also visually see that <code class="hint_blue">\dfrac{<var>N</var>}{<var>D</var>}</code> of
<code class="hint_orange"><var>AMOUNT</var></code> is <code class="hint_green"><var>SOLUTION</var></code>:
</p>
<div class="graphie">
init({ range: [ [ -0.05, 1 ], [ 0, 3 ] ],scale: [ 450, 30 ] });
rectchart( [ N, D - N ], [ BLUE, "#ccc" ], 2 );
rectchart( [ AMOUNT, 0 ], [ ORANGE, "#999" ], 1 );
rectchart( [ SOLUTION, AMOUNT - SOLUTION ], [ GREEN, BACKGROUND ], 0 );
style({ color: BLUE }, function() {
label([ 0, 2.5 ], "\\frac{" + N + "}{" + D + "}", "left" );
});
style({ color: ORANGE }, function() {
label([ 0, 1.5 ], AMOUNT, "left" );
});
style({ color: GREEN }, function() {
label([ 0, 0.5 ], SOLUTION, "left" );
});
</div>
</div>
<p><strong><var>person( 1 )</var> spent $<var>SOLUTION</var>.00 on canned food for the homeless shelter.</strong></p>
</div>
</div>
<div id="road-trip-gas">
<div class="vars" data-ensure="isInt( SOLUTION ) && getGCD( D, N ) === 1">
<var id="GALLONS">randRange( 10, 20 )</var>
<var id="D">randFromArray([ 8, 6, 10 ])</var>
<var id="N">randRange( 1, D - 1 )</var>
<var id="SOLUTION">N / D * GALLONS</var>
</div>
<p class="problem">
Before leaving on a road trip, <var>person( 1 )</var> filled up <var>his( 1 )</var> gas tank, which holds
<var>GALLONS</var> gallons of gas. After <var>0.5 * randRange( 3 / 0.5, 10 / 0.5 )</var> hours, <var>person( 1 )</var>
noticed that the gas tank was <code>\frac{<var>N</var>}{<var>D</var>}</code> full.
</p>
<p class="question">How many gallons of gas were left in the tank?</p>
<div class="solution" data-type="multiple">
<span style="padding-right: 5px" class="sol" data-forms="integer"><var>SOLUTION</var></span> gallons
</div>
<div class="hints">
<p>
Since a fraction of the gas in <var>his( 1 )</var> tank was left, we just need to figure out what
<code>\dfrac{<var>N</var>}{<var>D</var>}</code> of <code><var>GALLONS</var></code> gallons is to find out
how much gas was left in the tank.
</p>
<p>
We can find <code>\dfrac{<var>N</var>}{<var>D</var>}</code> of <code><var>GALLONS</var></code> gallons by multiplying
<code class="hint_blue">\dfrac{<var>N</var>}{<var>D</var>}</code> and <code class="hint_orange"><var>GALLONS</var></code>.
</p>
<p><code>
\color{<var>BLUE</var>}{\dfrac{<var>N</var>}{<var>D</var>}} \times \color{<var>ORANGE</var>}{<var>GALLONS</var>} =
\color{<var>GREEN</var>}{\text{?}}
</code></p>
<p><code>
\color{<var>BLUE</var>}{\dfrac{<var>N</var>}{<var>D</var>}} \times \color{<var>ORANGE</var>}{\dfrac{<var>GALLONS</var>}{1}} =
\dfrac{\color{<var>BLUE</var>}{<var>N</var>} \cdot \color{<var>ORANGE</var>}{<var>GALLONS</var>}}
{\color{<var>BLUE</var>}{<var>D</var>} \cdot \color{<var>ORANGE</var>}{1}} = \color{<var>GREEN</var>}{\text{?}}
</code></p>
<p><code>
\dfrac{\color{<var>BLUE</var>}{<var>N</var>} \cdot \color{<var>ORANGE</var>}{<var>GALLONS</var>}}
{\color{<var>BLUE</var>}{<var>D</var>}} = \color{<var>GREEN</var>}{\dfrac{<var>N * GALLONS</var>}{<var>D</var>}} =
\color{<var>GREEN</var>}{<var>SOLUTION</var>}
</code></p>
<div>
<p>
We can also visually see that <code class="hint_blue">\dfrac{<var>N</var>}{<var>D</var>}</code> of
<code class="hint_orange"><var>GALLONS</var></code> is <code class="hint_green"><var>SOLUTION</var></code>:
</p>
<div class="graphie">
init({ range: [ [ -0.05, 1 ], [ 0, 3 ] ],scale: [ 450, 30 ] });
rectchart( [ N, D - N ], [ BLUE, "#ccc" ], 2 );
rectchart( [ GALLONS, 0 ], [ ORANGE, "#999" ], 1 );
rectchart( [ SOLUTION, GALLONS - SOLUTION ], [ GREEN, BACKGROUND ], 0 );
style({ color: BLUE }, function() {
label([ 0, 2.5 ], "\\frac{" + N + "}{" + D + "}", "left" );
});
style({ color: ORANGE }, function() {
label([ 0, 1.5 ], GALLONS, "left" );
});
style({ color: GREEN }, function() {
label([ 0, 0.5 ], SOLUTION, "left" );
});
</div>
</div>
<p><strong><var>person( 1 )</var> had <var>SOLUTION</var> gallons of gas left in <var>his( 1 )</var> tank when <var>he( 1 )</var> checked.</strong></p>
</div>
</div>
<div id="picnic-attendees">
<div class="vars" data-ensure="isInt( SOLUTION ) && getGCD( D, N ) === 1">
<var id="ATTENDEES">randRange( 15, 40 )</var>
<var id="D">randFromArray([ 8, 6, 10 ])</var>
<var id="N">randRange( 1, D - 1 )</var>
<var id="SOLUTION">N / D * ATTENDEES</var>
</div>
<p class="problem">
<var>ATTENDEES</var> people had a picnic in the park.
<code>\frac{<var>N</var>}{<var>D</var>}</code> of the people at the picnic were adults.
</p>
<p class="question">How many adults were at the picnic?</p>
<div class="solution" data-type="multiple">
<span style="padding-right: 5px" class="sol" data-forms="integer"><var>SOLUTION</var></span> adults
</div>
<div class="hints">
<p>
We need to figure out what <code>\dfrac{<var>N</var>}{<var>D</var>}</code> of <code><var>ATTENDEES</var></code> is to find out
how many people at the picnic were adults.
</p>
<p>
We can find <code>\dfrac{<var>N</var>}{<var>D</var>}</code> of <code><var>ATTENDEES</var></code> by multiplying
<code class="hint_blue">\dfrac{<var>N</var>}{<var>D</var>}</code> and <code class="hint_orange"><var>ATTENDEES</var></code>.
</p>
<p><code>
\color{<var>BLUE</var>}{\dfrac{<var>N</var>}{<var>D</var>}} \times \color{<var>ORANGE</var>}{<var>ATTENDEES</var>} =
\color{<var>GREEN</var>}{\text{?}}
</code></p>
<p><code>
\color{<var>BLUE</var>}{\dfrac{<var>N</var>}{<var>D</var>}} \times \color{<var>ORANGE</var>}{\dfrac{<var>ATTENDEES</var>}{1}} =
\dfrac{\color{<var>BLUE</var>}{<var>N</var>} \cdot \color{<var>ORANGE</var>}{<var>ATTENDEES</var>}}
{\color{<var>BLUE</var>}{<var>D</var>} \cdot \color{<var>ORANGE</var>}{1}} = \color{<var>GREEN</var>}{\text{?}}
</code></p>
<p><code>
\dfrac{\color{<var>BLUE</var>}{<var>N</var>} \cdot \color{<var>ORANGE</var>}{<var>ATTENDEES</var>}}
{\color{<var>BLUE</var>}{<var>D</var>}} = \color{<var>GREEN</var>}{\dfrac{<var>N * ATTENDEES</var>}{<var>D</var>}} =
\color{<var>GREEN</var>}{<var>SOLUTION</var>}
</code></p>
<div>
<p>
We can also visually see that <code class="hint_blue">\dfrac{<var>N</var>}{<var>D</var>}</code> of
<code class="hint_orange"><var>ATTENDEES</var></code> is <code class="hint_green"><var>SOLUTION</var></code>:
</p>
<div class="graphie">
init({ range: [ [ -0.05, 1 ], [ 0, 3 ] ],scale: [ 450, 30 ] });
rectchart( [ N, D - N ], [ BLUE, "#ccc" ], 2 );
rectchart( [ ATTENDEES, 0 ], [ ORANGE, "#999" ], 1 );
rectchart( [ SOLUTION, ATTENDEES - SOLUTION ], [ GREEN, BACKGROUND ], 0 );
style({ color: BLUE }, function() {
label([ 0, 2.5 ], "\\frac{" + N + "}{" + D + "}", "left" );
});
style({ color: ORANGE }, function() {
label([ 0, 1.5 ], ATTENDEES, "left" );
});
style({ color: GREEN }, function() {
label([ 0, 0.5 ], SOLUTION, "left" );
});
</div>
</div>
<p><strong><var>SOLUTION</var> people at the picnic were adults.</strong></p>
</div>
</div>
<div id="recipe">
<div class="vars" data-ensure="isInt( SOLUTION ) && getGCD( D, N ) === 1">
<var id="BATCHES">(randRange( 1,5 )*D)</var>
<var id="D">randFromArray([ 2,8 ])</var>
<var id="N">randRange( 1, D - 1 )</var>
<var id="SOLUTION">N / D * BATCHES</var>
</div>
<div class="problem">
<p>
<var>person(1)</var> decided to bake cookies for the school bake sale. <var>He(1)</var> found a recipe
that called for <code>\frac{<var>N</var>}{<var>D</var>}</code> of a cup of chocolate chips.
</p>
<p>
To have enough cookies for the bake sale, <var>person(1)</var> needed to make <var>BATCHES</var> batches of cookies.
</p>
</div>
<p class="question">How many cups of chocolate chips did <var>person(1)</var> need in total?</p>
<div class="solution" data-type="multiple">
<span style="padding-right: 5px" class="sol" data-forms="integer"><var>SOLUTION</var></span> cups
</div>
<div class="hints">
<p>
We can multiply <code class="hint_blue">\dfrac{<var>N</var>}{<var>D</var>}</code> cup by <code class="hint_orange"><var>BATCHES</var></code>
batches to find out how many cups of chocolate chips <var>person(1)</var> needed.
</p>
<p><code>
\color{<var>BLUE</var>}{\dfrac{<var>N</var>}{<var>D</var>}} \times \color{<var>ORANGE</var>}{<var>BATCHES</var>} =
\color{<var>GREEN</var>}{\text{?}}
</code></p>
<p><code>
\color{<var>BLUE</var>}{\dfrac{<var>N</var>}{<var>D</var>}} \times \color{<var>ORANGE</var>}{\dfrac{<var>BATCHES</var>}{1}} =
\dfrac{\color{<var>BLUE</var>}{<var>N</var>} \cdot \color{<var>ORANGE</var>}{<var>BATCHES</var>}}
{\color{<var>BLUE</var>}{<var>D</var>} \cdot \color{<var>ORANGE</var>}{1}} = \color{<var>GREEN</var>}{\text{?}}
</code></p>
<p><code>
\dfrac{\color{<var>BLUE</var>}{<var>N</var>} \cdot \color{<var>ORANGE</var>}{<var>BATCHES</var>}}
{\color{<var>BLUE</var>}{<var>D</var>}} = \color{<var>GREEN</var>}{\dfrac{<var>N * BATCHES</var>}{<var>D</var>}} =
\color{<var>GREEN</var>}{<var>SOLUTION</var>}
</code></p>
<!--
This is backwards for this problem. The visualization should somehow show that BATCHES instances of N/D is SOLUTION
<div>
<p>
We can also visually see that <code class="hint_blue">\dfrac{<var>N</var>}{<var>D</var>}</code> of
<code class="hint_orange"><var>BATCHES</var></code> is <code class="hint_green"><var>SOLUTION</var></code>:
</p>
<div class="graphie">
init({ range: [ [ -0.05, 1 ], [ 0, 3 ] ],scale: [ 500, 30 ] });
rectchart( [ N, D - N ], [ BLUE, "#ccc" ], 2 );
rectchart( [ BATCHES, 0 ], [ ORANGE, "#999" ], 1 );
rectchart( [ SOLUTION, BATCHES - SOLUTION ], [ GREEN, "#fff" ], 0 );
style({ color: BLUE }, function() {
label([ 0, 2.5 ], "\\frac{" + N + "}{" + D + "}", "left" );
});
style({ color: ORANGE }, function() {
label([ 0, 1.5 ], BATCHES, "left" );
});
style({ color: GREEN }, function() {
label([ 0, 0.5 ], SOLUTION, "left" );
});
</div>
</div>
-->
<p><strong><var>person(1)</var> needed <var>plural(SOLUTION, "cup")</var> of chocolate chips to make enough cookies for the bake sale.</strong></p>
</div>
</div>
</div>
</div>
</body>
</html>
Something went wrong with that request. Please try again.