// Numbas version: finer_feedback_settings
{"name": "Graphs: Vertical shift transformation", "extensions": ["jsxgraph"], "custom_part_types": [], "resources": [], "navigation": {"allowregen": true, "showfrontpage": false, "preventleave": false, "typeendtoleave": false}, "question_groups": [{"pickingStrategy": "all-ordered", "questions": [{"functions": {}, "ungrouped_variables": ["selector", "vsh", "hsh", "vsc", "hsc", "yo", "yn", "xo", "xn", "yo0", "yo1", "yo2", "yo3", "yo4", "maxx", "maxy"], "name": "Graphs: Vertical shift transformation", "tags": [], "preamble": {"css": "table#values th {\n  background: none;\n  text-align: center;\n}", "js": "function dragpoint_board() {\n  var scope = question.scope;\n  \n // var a = scope.variables.a.value;\n//  var c = scope.variables.c.value;\n\n  var yo0 = scope.variables.yo0.value;\n  var yo1 = scope.variables.yo1.value;\n  var yo2 = scope.variables.yo2.value;\n  var yo3 = scope.variables.yo3.value;  \n  var yo4 = scope.variables.yo4.value;\n    \n  var maxx = scope.variables.maxx.value;\n  var maxy = scope.variables.maxy.value;\n  \n  var div = Numbas.extensions.jsxgraph.makeBoard('500px','500px',{boundingBox:[-maxx,maxy,maxx,-maxy],grid:true});\n  $(question.display.html).find('#dragpoint').append(div);\n  \n  var board = div.board;\n  \n  \n   //create stationary points\n    \n  var op0 = board.create('point',[-2,yo0],{name:'',fixed:true,size:2,color:'black'});\n    var op1 = board.create('point',[-1,yo1],{name:'',fixed:true,size:2,color:'black'});\n    var op2 = board.create('point',[0,yo2],{name:'',fixed:true,size:2,color:'black'});\n    var op3 = board.create('point',[1,yo3],{name:'',fixed:true,size:2,color:'black'});\n    var op4 = board.create('point',[2,yo4],{name:'',fixed:true,size:2,color:'black'});\n    \n    \n    //create draggable points\n    //why are there are a cloine under each one?\n    var np0 = board.create('point',[-2,yo0],{name:'A',size:2,snapSizeX: 0.25,snapSizeY: 0.25,snapToGrid: true});\n    var np1 = board.create('point',[-1,yo1],{name:'B',size:2,snapSizeX: 0.25,snapSizeY: 0.25,snapToGrid: true});\n    var np2 = board.create('point',[0,yo2],{name:'C',size:2,snapSizeX: 0.25,snapSizeY: 0.25,snapToGrid: true});\n    var np3 = board.create('point',[1,yo3],{name:'D',size:2,snapSizeX: 0.25,snapSizeY: 0.25,snapToGrid: true});\n    var np4 = board.create('point',[2,yo4],{name:'E',size:2,snapSizeX: 0.25,snapSizeY: 0.25,snapToGrid: true});\n  \n  \n    \n  \n  //shorthand to evaluate a mathematical expression to a number\n  function evaluate(expression) {\n    try {\n      var val = Numbas.jme.evaluate(expression,question.scope);\n      return Numbas.jme.unwrapValue(val);\n    }\n    catch(e) {\n      // if there's an error, return no number\n      return NaN;\n    }\n  }\n  \n  // set up points array\n  var num_points = 5;\n  var points = [np0, np1, np2, np3, np4];\n  \n  \n  // this function sets up the i^th point\n  function make_point(i) {\n    \n    // calculate initial coordinates\n  //  var x = i-(num_points-1)/2;\n    \n    // create an invisible vertical line for the point to slide along\n   // var line = board.create('line',[[x,0],[x,1]],{visible: false});\n    \n    // create the point\n  //  var point = points[i] = board.create(\n   //   'point',\n   //   [i-(num_points-1)/2,0],\n   //   {\n    //    name:'',\n   //     size:2,\n    //    snapSizeY: 0.25,  // the point will snap to y-coordinates which are multiples of 0.1\n    //    snapSizeX: 0.25,\n   //     snapToGrid: true\n    //  }\n   // );\n    \n   var point = points[i];\n    \n    var x=point[0];\n    var y=point[1];\n    \n    // the contents of the input box for this point\n    var xstudentAnswer = question.parts[0].gaps[2*i].display.studentAnswer;\n    var ystudentAnswer = question.parts[0].gaps[2*i+1].display.studentAnswer;\n    \n    // watch the student's input and reposition the point when it changes.    \n    ko.computed(function() {\n      x = evaluate(xstudentAnswer());\n      y = evaluate(ystudentAnswer());\n      if(!(isNaN(x)) && !(isNaN(y)) && board.mode!=board.BOARD_MODE_DRAG) {\n        point.moveTo([x,y],100);\n      }\n    });\n    \n    // when the student drags the point, update the gapfill input\n    point.on('drag',function(){\n      var x = Numbas.math.niceNumber(point.X());\n      var y = Numbas.math.niceNumber(point.Y());\n      xstudentAnswer(x);\n      ystudentAnswer(y);\n    });\n    \n  }\n  \n  // create each point\n  for(var i=0;i<num_points;i++) {\n    make_point(i);\n  }\n  \n  // create the parabola\n  var parabool = board.create('spline',[np0, np1, np2, np3, np4],{strokeWidth:3,strokeColor:'red'});\n  var statparabool = board.create('spline',[op0, op1, op2, op3, op4],{strokeWidth:3,strokeColor:'black'});\n\n}\n\nquestion.signals.on('HTMLAttached',function() {\n  dragpoint_board();\n}); "}, "advice": "", "rulesets": {"std": ["all", "fractionNumbers"]}, "parts": [{"stepsPenalty": "10", "prompt": "<div id=\"dragpoint\"></div>\n<p>The point $A$ was $(-2,\\var{yo0})$ but it is now $\\big($[[0]],[[1]]$\\big)$.<br/>The point $B$ was $(-1,\\var{yo1})$ but it is now $\\big($[[2]],[[3]]$\\big)$.<br/>The point $C$ was $(0,\\var{yo2})$ but it is now $\\big($[[4]],[[5]]$\\big)$.<br/>The point $D$ was $(1,\\var{yo3})$ but it is now $\\big($[[6]],[[7]]$\\big)$.<br/>The point $E$ was $(2,\\var{yo4})$ but it is now $\\big($[[8]],[[9]]$\\big)$.</p>", "variableReplacements": [], "variableReplacementStrategy": "originalfirst", "steps": [{"prompt": "<p>$y=\\simplify[fractionNumbers,all]{{vsc}f({hsc}x+{hsh})+{vsh}}$ means that the new graph will be the old graph except the $y$ value of each point on the graph will be $\\var{abs(vsh)}$ unit<span data-jme-visible=\"abs(vsh)&lt;&gt;1\">s</span>&nbsp;<span data-jme-visible=\"vsh&gt;0\"> greater</span> <span data-jme-visible=\"vsh&lt;0\"> less</span> than they were before. Since the $y$ value is displayed in the vertical direction, this means&nbsp;the old graph is shifted vertically by $\\var{vsh}$ unit<span data-jme-visible=\"abs(vsh)&lt;&gt;1\">s</span> to give the new graph.</p>\n<p></p>\n<p></p>", "variableReplacements": [], "variableReplacementStrategy": "originalfirst", "showCorrectAnswer": true, "scripts": {}, "marks": 0, "type": "information"}], "gaps": [{"allowFractions": true, "variableReplacements": [], "maxValue": "xn[0]", "minValue": "xn[0]", "variableReplacementStrategy": "originalfirst", "correctAnswerFraction": false, "showCorrectAnswer": true, "scripts": {}, "marks": 1, "type": "numberentry", "showPrecisionHint": false}, {"allowFractions": true, "variableReplacements": [], "maxValue": "yn[0]", "minValue": "yn[0]", "variableReplacementStrategy": "originalfirst", "correctAnswerFraction": false, "showCorrectAnswer": true, "scripts": {}, "marks": 1, "type": "numberentry", "showPrecisionHint": false}, {"allowFractions": true, "variableReplacements": [], "maxValue": "xn[1]", "minValue": "xn[1]", "variableReplacementStrategy": "originalfirst", "correctAnswerFraction": false, "showCorrectAnswer": true, "scripts": {}, "marks": 1, "type": "numberentry", "showPrecisionHint": false}, {"allowFractions": true, "variableReplacements": [], "maxValue": "yn[1]", "minValue": "yn[1]", "variableReplacementStrategy": "originalfirst", "correctAnswerFraction": false, "showCorrectAnswer": true, "scripts": {}, "marks": 1, "type": "numberentry", "showPrecisionHint": false}, {"allowFractions": true, "variableReplacements": [], "maxValue": "xn[2]", "minValue": "xn[2]", "variableReplacementStrategy": "originalfirst", "correctAnswerFraction": false, "showCorrectAnswer": true, "scripts": {}, "marks": 1, "type": "numberentry", "showPrecisionHint": false}, {"allowFractions": true, "variableReplacements": [], "maxValue": "yn[2]", "minValue": "yn[2]", "variableReplacementStrategy": "originalfirst", "correctAnswerFraction": false, "showCorrectAnswer": true, "scripts": {}, "marks": 1, "type": "numberentry", "showPrecisionHint": false}, {"allowFractions": true, "variableReplacements": [], "maxValue": "xn[3]", "minValue": "xn[3]", "variableReplacementStrategy": "originalfirst", "correctAnswerFraction": false, "showCorrectAnswer": true, "scripts": {}, "marks": 1, "type": "numberentry", "showPrecisionHint": false}, {"allowFractions": true, "variableReplacements": [], "maxValue": "yn[3]", "minValue": "yn[3]", "variableReplacementStrategy": "originalfirst", "correctAnswerFraction": false, "showCorrectAnswer": true, "scripts": {}, "marks": 1, "type": "numberentry", "showPrecisionHint": false}, {"allowFractions": true, "variableReplacements": [], "maxValue": "xn[4]", "minValue": "xn[4]", "variableReplacementStrategy": "originalfirst", "correctAnswerFraction": false, "showCorrectAnswer": true, "scripts": {}, "marks": 1, "type": "numberentry", "showPrecisionHint": false}, {"allowFractions": true, "variableReplacements": [], "maxValue": "yn[4]", "minValue": "yn[4]", "variableReplacementStrategy": "originalfirst", "correctAnswerFraction": false, "showCorrectAnswer": true, "scripts": {}, "marks": 1, "type": "numberentry", "showPrecisionHint": false}], "showCorrectAnswer": true, "scripts": {}, "marks": 0, "type": "gapfill"}], "extensions": ["jsxgraph"], "statement": "<p>The&nbsp;graph of a function $y=f(x)$ is shown below. Move the red points so the red curve represents $y=\\simplify[fractionNumbers,all]{{vsc}f({hsc}x+{hsh})+{vsh}}$.</p>", "variable_groups": [], "variablesTest": {"maxRuns": 100, "condition": ""}, "variables": {"hsc": {"definition": "if(selector='hsc',random(-2,-1,-0.5,0.5,2),1)", "templateType": "anything", "group": "Ungrouped variables", "name": "hsc", "description": ""}, "maxx": {"definition": "max(map(abs(a),a,xn)+5)+1", "templateType": "anything", "group": "Ungrouped variables", "name": "maxx", "description": ""}, "maxy": {"definition": "max(map(abs(a),a,yn)+5)+1", "templateType": "anything", "group": "Ungrouped variables", "name": "maxy", "description": ""}, "xn": {"definition": "map((x-hsh)/hsc,x,xo)", "templateType": "anything", "group": "Ungrouped variables", "name": "xn", "description": "<p>new transformed x values</p>"}, "xo": {"definition": "list(-2..2)", "templateType": "anything", "group": "Ungrouped variables", "name": "xo", "description": "<p>original x values</p>"}, "yo": {"definition": "repeat(random(-5..5),5)", "templateType": "anything", "group": "Ungrouped variables", "name": "yo", "description": "<p>the (random) original y values which relate to the x values</p>"}, "yn": {"definition": "map(vsc*y+vsh,y,yo)", "templateType": "anything", "group": "Ungrouped variables", "name": "yn", "description": "<p>new y values after the transformation</p>"}, "hsh": {"definition": "if(selector='hsh',random(-3..3 except 0),0)", "templateType": "anything", "group": "Ungrouped variables", "name": "hsh", "description": "<p>horizontal shift</p>"}, "selector": {"definition": "'vsh'", "templateType": "anything", "group": "Ungrouped variables", "name": "selector", "description": ""}, "vsc": {"definition": "if(selector='vsc',random(-2,-1,-0.5,0.5,2),1)", "templateType": "anything", "group": "Ungrouped variables", "name": "vsc", "description": ""}, "vsh": {"definition": "if(selector='vsh',random(-3..3#0.5 except 0),0)\n", "templateType": "anything", "group": "Ungrouped variables", "name": "vsh", "description": "<p>vertical shift</p>"}, "yo4": {"definition": "yo[4]", "templateType": "anything", "group": "Ungrouped variables", "name": "yo4", "description": ""}, "yo3": {"definition": "yo[3]", "templateType": "anything", "group": "Ungrouped variables", "name": "yo3", "description": ""}, "yo2": {"definition": "yo[2]", "templateType": "anything", "group": "Ungrouped variables", "name": "yo2", "description": ""}, "yo1": {"definition": "yo[1]", "templateType": "anything", "group": "Ungrouped variables", "name": "yo1", "description": ""}, "yo0": {"definition": "yo[0]", "templateType": "anything", "group": "Ungrouped variables", "name": "yo0", "description": ""}}, "metadata": {"description": "<p>of a random cubic spline</p>", "licence": "Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International"}, "type": "question", "showQuestionGroupNames": false, "question_groups": [{"name": "", "pickingStrategy": "all-ordered", "pickQuestions": 0, "questions": []}], "contributors": [{"name": "steve kilgallon", "profile_url": "https://numbas.mathcentre.ac.uk/accounts/profile/268/"}]}]}], "contributors": [{"name": "steve kilgallon", "profile_url": "https://numbas.mathcentre.ac.uk/accounts/profile/268/"}]}