Resolving vectors

This page is to help draw and manipulate parallelograms to teach resolution of 2D vectors.

Hover the mouse over a vector for guidance. Right click anywhere for a new vector.

Or left click the button, bottom right, for moments, and simple line drawing. Also freehand drawing, in case there is use for a tablet pen.

See below the panel to select a background diagram. Single left click to put the diagram in the frame, then click and drag.

Not tablet- or phone-friendly, as yet.

Your browser does not support the HTML5 canvas tag.

load a saved work file or a background image file:

Left click the buttons below to put diagrams into the frame.

AQA 7357 Specimen Paper 2 Mechanics
image: aqa-spec-box-5-degrees-thumb, AQA 7357 Paper 2 specimen
MEI M1
image: wall-string-box-string-floor, MEI M1 January 05 image: string-box-friction-slope-60, MEI M1 June 05 image: ballistic9aboveground, MEI M1 June 05 image: box-30-degree, MEI M1 January 06 image: parallelogram, MEI M1 January 2011 image: hanging-boxes-equilibrium, MEI M1 June 06 image: horizontal-force-holds-block-at-35, MEI M1 January 07 image: pulley-pulling-box-at-40, MEI M1 January 08 image: cylinder-in-tube, MEI M1 June 08 image: box-suspended-on-strings-by-ring, MEI M1 June 08 image: sledge, MEI M1 January 09 image: box-pulled-at-25-plus-15, MEI M1 June 09 image: pulley-at-70-to-wall, MEI M1 June 10 image: sledge-at-35-plus-theta, MEI M1 January 11 image: trolley-rod-trolley-5-degree, MEI M1 June 11 image: two-strings-particle-from-rod, MEI M1 Jan 12
MEI M2
image: skaters MEI M2 June 05 image: framework-against-wall MEI M2 June 05 image: beam-pulled-at-30-and-40 MEI M2 Jan 06 image: framework-on-supports MEI M2 Jan 06 image: pulley-up-slope MEI M2 Jan 06 image: bounce-at-given-angle MEI M2 Jun 06 image: hinged-structure MEI M2 Jun 06 image: framework-on-inclined-plane MEI M2 Jan 07 image: plank MEI M2 Jun 07 image: inclined-beam-with-pivot MEI M2 Jan 08 image: pendulum MEI M2 Jun 08 image: ladder-against-wall MEI M2 Jun 09 image: kitchen-cupboard MEI M2 Jan 10 image: cantilever MEI M2 Jun 11 image: beam-on-peg MEI M2 Jan 12 image: cylinder-on-slope MEI M2 Jun 16
Edexcel M1
image: horizontal plank Edexcel M1 June 2017 image: particle held on plane Edexcel M1 June 2017 image: particle pair Edexcel M1 June 2017 image: ships Edexcel M1 June 2017 image: perpendicular pulley Edexcel M1 June 2017 image: scale pan Edexcel M1 June 16 image: particle held on plane Edexcel M1 June 2016 image: plank Edexcel M1 June 2016 image: particle on two strings Edexcel M1 June 2015 image: beam on two ropes Edexcel M1 June 2015 image: pulley on rough 345 plane Edexcel M1 June 2015 image: particle by two strings from ceiling Edexcel M1 June 2014 image: particle rough 40 degree plane Edexcel M1 June 2014 image: beam on two ropes Edexcel M1 June 2014 image: resultant and diagonal Edexcel M1 June 2014 image: pulley separates Edexcel M1 June 2014
Edexcel M2
image: particle impact Edexcel M2 June 2017 image: truck and towbar up one in nine slope Edexcel M2 June 2017 image: folded lamina Edexcel M2 June 2017 image: rod on rough ground Edexcel M2 June 2017 image: slope one in twenty Edexcel M2 June 2016 image: particle impulse Edexcel M2 June 2016 image: sector lamina Edexcel M2 June 2016 image: rod between ground and perpenicular tension Edexcel M2 June 2016 image: displacement and velocity functions Edexcel M2 June 2016 image: particles and wall Edexcel M2 June 2016 image: slope one in twenty Edexcel M2 June 2015 image: lamina Edexcel M2 June 2015 image: impulse Edexcel M2 June 2015 image: ladder against wall Edexcel M2 June 2015 image: inclined plane Edexcel M2 June 2015 image:
OCR M1 2016
image: stone falling from Bridge, OCR M1 2016 by kind permission image: OCR M1 2016 by kind permission image: OCR M1 2016 by kind permission image: OCR M1 2016 by kind permission image: OCR M1 2016 by kind permission image: rough ncline with pulley, OCR M1 2016 by kind permission image: OCR M1 2016 by kind permission ... videos for this paper here
OCR M2 2016
image: power of car climbing 10 degrees image: work against friction at 55 degrees image: semi-circular lamina with hole image: horizontal circular motion on cone image: man on ladder against wall image: two particles collide, find velocities and co-efficient image: mid-air collision

There are no double clicks. All click and drag is left mouse button. All single clicks are right button in the frame; but single clicks are left button out of the frame (for all of the buttons, where right wasn't feasible, sorry about that).

The right-clicks for the magnitude and angle labels toggle as follows:
 Magnitude (or moment or line) label: first click, get default expression; second click, open menu; third click, close menu.
 Angle: first click, get default expression; second click open menu; third click, close menu, keep new expression and lock angle (shows arc); fourth click, lose expression and keep arc; fifth click lose all.

For subscripts, type an underscore '_' before the character; for superscripts, a hat '^' before the character.
For Greek letters, type a '`' (far left key on the number row) before an approximate English correlate.
For the degree circle '°', type '@'.
For the root sign '√', type back slash '\'.
For fractions '¼', '½' and '¾', type shift-1, shift-2 and shift-3.

Hover near the top end of a vector (or moment or other) and type ctrl-c to copy the shape, then ctrl-v to paste at a new mouse position.
With ctrl key down, left click on whitespace and drag to enclose multiple shapes in a box to copy (ctrl-c while dragging when box ready) or drag (ctrl-d while dragging when box ready, then mouse up then click in box and drag).
In Chrome and Firefox but not IE: the very first ctrl-v (in a refreshed page) will paste any image currently in the main operating system's clipboard. E.g. a screenshot.
Or you can load a background image (as well as saved work) using the load button.
Either way, the background image will not be included in a work file that you save. (But can of course be reloaded along with the work file.)
'Print' exports a snapshot (including background, but minus buttons) as a png file.

There are also two blank sheets with just a centimetre corner poking out (when you hover) top-left and top-right, which can be dragged over unwanted parts of a background image.

There is some undo and re-do function (ctrl-z and ctrl-y).

ctrl-left-arrow will hide shapes one by one. ctrl-right-arrow will un-hide one by one (including those hidden by ctrl-h). (Excluding freehand marks.)
This allows you to present a ready-made picture step-by-step, powerpoint-style. While presenting you can also modify any (unhidden) shape in the sequence, and insert or remove from the sequence.
Notice also you can unhide a shape, then subsequently unhide its various labels.

Really grateful for any contributions in the form of worked examples to add to the wall, above. (Email the work file and the background image file if any.)

All feedback welcome, including improvements to the amateur coding, and reports of unfriendly behaviour.

Latest update 10/12/18. Tweaked print.

link: TES recommended resource

tom@ballooncalculus.org.