derivatives_1.html

{% extends arithmetic_template %}

{% block maincode %}
{% endblock maincode %}

{% block maincell %}
<script language=Javascript1.2><!--

degree = getRandomIntRange(2, 3);
coefs = new Array();

polyn = '';
for (var i = degree; i >= 0; i--) {
	coefs[i] = getRandomIntRange(-4, 4);
	if (coefs[i] != 0) {
		if (i == 1) {
			polyn = polyn + ' + ' + coefs[i] + 'x';
		} else if (i == 0) {
			polyn = polyn + ' + ' + coefs[i];
		} else {
			polyn = polyn + ' + ' + coefs[i] + 'x^' + i;
		}
	}
}

polyn = nicefySigns(polyn.substring(2));

function f(x) {
	var y = 0;
	for (var i = degree; i >= 0; i--) {
		y = y + coefs[i] * Math.pow(x, i);
	} 
	return y;
}

function fprime(x) {
	var y = 0;
	for (var i = degree; i > 0; i--) {
		// we don't want i=0, because that's messy when x=0
		// (0x^-1, then 0/x, then 0/0)
		y = y + (coefs[i]*i) * Math.pow(x, i-1);
	} 
	return y;
}

// calculate the boundaries for a visible x coordinate

for (minX = -9;
	Math.abs(0 - f(minX)) > 9;
	minX++);
	
for (maxX = 9;
	Math.abs(0 - f(maxX)) > 9;
	maxX--);

a = getRandomIntRange(minX, maxX);

m = fprime(a);
setCorrectAnswer(m);

write_text('<p>Find <span style="color:blue">the slope</span> of `y = ' + polyn + '`</p>' +
			'<p style="color:blue">when `x = ' + a + '`</p>');

write_step('<p>The slope is always changing, but we can approximate <span style="color:blue">the slope at `x=' + a + '`</span> ' +
			'by taking a point slightly away from ' + a + ' and finding <span style="color:green">the slope from there to ' + a + '</span>.</p>' +
			'<p>We can then see what happens to the slope as we test closer and closer points.</p>');

function text_f(x) {
	var ftext = '';
	for (var i = degree; i >= 0; i--) {
		if (coefs[i] != 0) {
			if (i == 1) {
				ftext = ftext + ' + ' + coefs[i] + '(' + x + ')';
			} else if (i == 0) {
				ftext = ftext + ' + ' + coefs[i];
			} else {
				ftext = ftext + ' + ' + coefs[i] + '(' + x + ')^' + i;
			}
		}
	}
	return nicefySigns(ftext.substring(3));
}

function slope_expression(x2, x1) {
	// generate the expression for slope from a to nearby point
	return nicefySigns('((' + text_f(x2) + ') - (' + text_f(x1) + ')) / (' + x2 + ' - ' + x1 + ')');
}

var mapprox_1 = ((f(a+0.1) - f(a)) / (a+0.1 - a)).toFixed(4);

write_step('<p style="color:green">The slope between `x=' + a + '` and `x=' + (a+0.1) + '` is:</p>' +
			'<p>`text{slope} = (Deltay)/(Deltax)`</p>' +
			'<p>` = ' + slope_expression(a+0.1, a) + '`</p>' +
			'<p><span style="color:green">` = ' + mapprox_1 + '`</span></p>');

var mapprox_2 = ((f(a+0.01) - f(a)) / (a+0.01 - a)).toFixed(4);

write_step('<p style="color:#5F9EA0">The slope between `x=' + a + '` and `x=' + (a+0.01) + '` is:</p>' +
			'<p>`text{slope} = (Deltay)/(Deltax)`</p>' +
			'<p>` = ' + slope_expression(a+0.01, a) + '`</p>' +
			'<p><span style="color:#5F9EA0">` = ' + mapprox_2 + '`</span></p>');
write_step('<p>Looks like <span style="color:blue">the slope at `x=' + a + '`</span> is approaching <span style="color:blue">' + m + '</span>.</p>');

function graph_update() {
	initPlane();
	
	present.stroke = "red";
	present.plot(polyn);
}

function draw_next_step() {
	if (steps_given == 3) {
		present.ASdot([a, f(a)], 3, "black", "black");
		
		present.stroke = "blue";
		// calculate y-intercept
		// y = mx + b
		// f(x) = mx + b
		// b = f(x) - mx
		present.plot('y = ' + m + 'x + ' + (f(a) - m * a));
	}
	give_next_step();
}
//-->
</script>
{% endblock maincell %}

{% block graphdisplay %}
<td valign=top><iframe name="present" id="present" frameborder=0 src="/graphpage.html?w=400&h=400" height="430" width="430"></iframe></td>
{% endblock graphdisplay %}

{% block hintfunction %}draw_next_step(){% endblock hintfunction %}