// Numbas version: finer_feedback_settings {"name": "Edward's copy of Use student input in a JSXGraph diagram", "extensions": ["jsxgraph"], "custom_part_types": [], "resources": [], "navigation": {"allowregen": true, "showfrontpage": false, "preventleave": false, "typeendtoleave": false}, "question_groups": [{"pickingStrategy": "all-ordered", "questions": [{"preamble": {"css": "", "js": ""}, "tags": [], "variables": {"b": {"name": "b", "group": "Ungrouped variables", "description": "", "templateType": "anything", "definition": "random(-6..6 except [0,a])"}, "x2": {"name": "x2", "group": "Ungrouped variables", "description": "", "templateType": "anything", "definition": "random(-3..3 except -1..1)"}, "a": {"name": "a", "group": "Ungrouped variables", "description": "", "templateType": "anything", "definition": "random(-4..4 except 0)"}, "y2": {"name": "y2", "group": "Ungrouped variables", "description": "", "templateType": "anything", "definition": "x2*a+b"}}, "extensions": ["jsxgraph"], "name": "Edward's copy of Use student input in a JSXGraph diagram", "variable_groups": [], "variablesTest": {"condition": "", "maxRuns": 100}, "statement": "

{eqnline(a,b,x2,y2)}

The above graph shows a line which has an equation of the form $y=ax+b$, where $a$ and $b$ are integers.

You are given two points on the line, $(0,\\var{b})$ and $(\\var{x2},\\var{y2})$, as indicated on the diagram.

", "ungrouped_variables": ["x2", "b", "a", "y2"], "parts": [{"type": "gapfill", "prompt": "

Write the equation of the line in the diagram. The line described by your equation will also be drawn on the diagram.

$y=\\;$[[0]]

", "variableReplacements": [], "showCorrectAnswer": true, "showFeedbackIcon": true, "marks": 0, "gaps": [{"type": "jme", "answersimplification": "all", "variableReplacements": [], "showpreview": true, "vsetrange": [0, 1], "checkingaccuracy": 0.001, "checkvariablenames": false, "marks": 1, "checkingtype": "absdiff", "scripts": {}, "variableReplacementStrategy": "originalfirst", "answer": "{a}x+{b}", "showCorrectAnswer": true, "expectedvariablenames": [], "showFeedbackIcon": true, "vsetrangepoints": 5}], "variableReplacementStrategy": "originalfirst", "scripts": {}}], "metadata": {"licence": "Creative Commons Attribution 4.0 International", "description": "

There are copious comments in the definition of the function eqnline about the voodoo needed to have a JSXGraph diagram interact with the input box for a part.

"}, "advice": "\n

First Method.

You are given that the line goes through $(0,\\var{b})$ and $(-1,\\var{b-a})$ and the equation of the line is of the form $y=ax+b$

Hence:

1) At $x=0$ we have $y=\\var{b}$, and this gives $\\var{b}=a \\times 0 +b =b$ on putting $x=0$ into $y=ax+b$.

So $b=\\var{b}$.

2) At $x=-1$ we have $y=\\var{b-a}$, and this gives $\\var{b-a}=a \\times (-1) +b =\\simplify[all,!collectNumbers]{-a+{b}}$ on putting $x=-1$ into $y=ax+b$.

On rearranging we obtain $a=\\simplify[all,!collectNumbers]{{b}-{b-a}}=\\var{a}$.

So $a=\\var{a}$.

So the equation of the line is $\\simplify{y={a}*x+{b}}$.

Second Method.

The equation $y=ax+b$ tells us that the graph crosses the $y$-axis (when $x=0$) at $y=b$.

So looking at the graph we immediately see that $b=\\var{b}$.

$a$ is the gradient of the line and is given by the change from $(-1,\\var{b-a})$ to $(0,\\var{b})$:

\\[a=\\frac{\\text{Change in y}}{\\text{Change in x}}=\\frac{\\simplify[all,!collectNumbers]{({b-a}-{b})}}{-1-0}=\\var{a}\\]

\n\n", "rulesets": {}, "functions": {"eqnline": {"type": "html", "parameters": [["a", "number"], ["b", "number"], ["x2", "number"], ["y2", "number"]], "language": "javascript", "definition": "// This function creates the board and sets it up, then returns an\n// HTML div tag containing the board.\n \n// The line is described by the equation \n// y = a*x + b\n\n// This function takes as its parameters the coefficients a and b,\n// and the coordinates (x2,y2) of a point on the line.\n\n// First, make the JSXGraph board.\n// The function provided by the JSXGraph extension wraps the board up in \n// a div tag so that it's easier to embed in the page.\nvar div = Numbas.extensions.jsxgraph.makeBoard('400px','400px',\n{boundingBox: [-13,16,13,-16],\n axis: false,\n showNavigation: false,\n grid: true\n});\n \nreturn div;"}}, "type": "question", "contributors": [{"name": "Edward Hall", "profile_url": "https://numbas.mathcentre.ac.uk/accounts/profile/1824/"}]}]}], "contributors": [{"name": "Edward Hall", "profile_url": "https://numbas.mathcentre.ac.uk/accounts/profile/1824/"}]}