// Numbas version: exam_results_page_options {"name": "Ann's copy of Use canvas to draw a rectangle", "extensions": [], "custom_part_types": [], "resources": [], "navigation": {"allowregen": true, "showfrontpage": false, "preventleave": false}, "question_groups": [{"pickingStrategy": "all-ordered", "questions": [{"statement": "

This rectangle is {w} metres wide and {h} metres long.

\n

{rectangle(w,h)}

", "name": "Ann's copy of Use canvas to draw a rectangle", "preamble": {"js": "", "css": ""}, "question_groups": [{"pickingStrategy": "all-ordered", "name": "", "pickQuestions": 0, "questions": []}], "contributors": [{"profile_url": "https://numbas.mathcentre.ac.uk/accounts/profile/7/", "name": "Christian Lawson-Perfect"}, {"profile_url": "https://numbas.mathcentre.ac.uk/accounts/profile/2295/", "name": "Ann Smith"}], "tags": ["canvas", "demo", "function", "graphic"], "variables": {"w": {"description": "", "name": "w", "group": "Ungrouped variables", "templateType": "anything", "definition": "random(100..200#5)"}, "h": {"description": "", "name": "h", "group": "Ungrouped variables", "templateType": "anything", "definition": "random(50..100#5)"}}, "functions": {"rectangle": {"parameters": [["w", "number"], ["h", "number"]], "definition": "\n var c = document.createElement('canvas');\n \$(c).attr('width',w+40).attr('height',h+40);\n var context = c.getContext('2d');\n \n //fill in rectangle with a light shade\n context.fillStyle = '#eee';\n context.fillRect(5,5,w,h);\n \n //draw outline\n context.strokeStyle = '#000';\n context.lineWidth = 3;\n context.strokeRect(5,5,w,h);\n \n //draw labels\n context.fillStyle = '#000';\n context.font = '20px sans-serif';\n var wstring = w+'m';\n var tw = context.measureText(wstring).width;\n console.log(tw);\n context.fillText(wstring,5+(w-tw)/2,5+h+25);\n \n var hstring = h+'m';\n var hw = context.measureText(hstring).width;\n context.save();\n context.translate(5+w+25,5+(h+hw)/2);\n context.rotate(-Math.PI/2);\n context.fillText(hstring,0,0);\n \n return c;\n ", "language": "javascript", "type": "html"}}, "variable_groups": [], "variablesTest": {"maxRuns": 100, "condition": ""}, "showQuestionGroupNames": false, "parts": [{"showCorrectAnswer": true, "maxValue": "2(w+h)", "correctAnswerFraction": false, "minValue": "2(w+h)", "marks": 1, "prompt": "

What is the rectangle's perimeter, in metres?

", "scripts": {}, "showPrecisionHint": false, "allowFractions": false, "type": "numberentry"}, {"showCorrectAnswer": true, "maxValue": "w*h", "correctAnswerFraction": false, "minValue": "w*h", "marks": 1, "prompt": "

What is the rectangle's area, in metres?

", "scripts": {}, "showPrecisionHint": false, "allowFractions": false, "type": "numberentry"}], "type": "question", "metadata": {"description": "

The custom function `rectangle(width,height)` draws a rectangle with the given dimensions, along with some labels.

", "notes": "

Doesn't work in IE8, because it doesn't support the canvas element.

", "licence": "Creative Commons Attribution 4.0 International"}, "advice": "", "rulesets": {}, "ungrouped_variables": ["h", "w"]}]}], "contributors": [{"profile_url": "https://numbas.mathcentre.ac.uk/accounts/profile/7/", "name": "Christian Lawson-Perfect"}, {"profile_url": "https://numbas.mathcentre.ac.uk/accounts/profile/2295/", "name": "Ann Smith"}]}