Plotting points in QI. Common Core State Standard: 5.G.1 Related Videos: Quadrants of Coordinate Plane, The Coordinate Plane Prerequisite: Number line (sort of, or coming soon Number line 0.5 which handles only positive points) Required/helpful For: Plotting points, Graphing linear equations, (coming soon) Graphing using x and y intercepts
randRange( 0, 10 ) randRange( 0, 10 )

Plot (X, Y)


graphInit({ range: [ [-1, 11], [-1, 11] ], scale: 30, axisArrows: "<->", tickStep: 1, labelStep: 1, gridOpacity: 0.05, axisOpacity: 0.2, tickOpacity: 0.4, labelOpacity: 0.5 }); label( [ 0, 11 ], "y", "above" ); label( [ 11, 0 ], "x", "right" ); addMouseLayer(); graph.movablePoint = addMovablePoint({coord: [0,0], snapY: 1, snapX: 1 }); graph.movablePoint.onMove = function( x, y ) { return [ max( 0, min( x, 10 ) ), max( 0, min( y, 10 ) ) ]; };
Drag the orange dot to graph the point.
graph.movablePoint.coord
if ( guess[0] === 0 && guess[1] === 0 ) { return ""; } return ( guess[0] === X && guess[1] === Y );
graph.movablePoint.setCoord( guess );

Coordinates are listed as (\blue{x},\green{y}).

So, for ( \blue{X}, \green{Y} ) our x-coordinate is X and our y-coordinate is Y.

The x-coordinate tells how far we move to the right from the origin and the y-coordinate tells us how far we move up from the origin.

Since our x-coordinate is equal to 0, we don't need to move to the right of the origin.

Since our x-coordinate is equal to X, we move X to the right of the origin.

style({ stroke: BLUE, strokeWidth: 3, arrows: "->" }, function() { line( [ 0, 0 ], [ X, 0 ]); }); graph.movablePoint.toFront();
Since our y-coordinate is equal to 0, we don't need to move up from the origin.

Since our y-coordinate is equal to Y, we move up Y from the origin.

style({ stroke: GREEN, strokeWidth: 3, arrows: "->" }, function() { line( [ X, 0 ], [ X, Y ] ); }); graph.movablePoint.toFront();

Move the point to ( \blue{X}, \green{Y} ) at the marked point above.

style({ stroke: PINK, strokeWidth: 3 }, function() { line( [ X - 0.25, Y - 0.25 ], [ X + 0.25, Y + 0.25 ] ); line( [ X + 0.25, Y - 0.25 ], [ X - 0.25, Y + 0.25 ] ); }); graph.movablePoint.toFront();