point()
Draws a point.
Use stroke()
to color a point and strokeWeight()
to change it's diameter. A point cannot be filled, therefore the fill()
function will not affect the color of a point.
The default stroke()
color is black and the default strokeWeight()
is 1.
Examples
point(100, 300);
Jackson Pollock
Use the mouse pointer position to place random lines and points.
// Use the mouse pointer position to place random lines and points.
function draw() {
stroke(rgb(randomNumber(0,255),randomNumber(0,255),randomNumber(0,255)));
if (randomNumber(0,1)==1) {
strokeWeight(randomNumber(1,5));
line(World.mouseX, World.mouseY, World.mouseX+randomNumber(-50,50),World.mouseY+randomNumber(-50,50));
}
else {
strokeWeight(randomNumber(10,30));
point(World.mouseX, World.mouseY);
}
}
Optical Illusion
Watch the X in the middle very closely. You should start to see a green dot that rotates around the circle - this dot is an illusion; then you should see the pink dots disappear.... but they haven't really gone. It is an after image effect, sometimes called a 'negative retinal afterimage' - move your head slightly, and the dots will reappear... amazing or what?
// Optical Illusion with Dots
var angle=0;
World.frameRate=12;
function draw() {
background("white");
strokeWeight(5);
line(200,190,200,210);
line(190,200,210,200);
stroke(rgb(255,0,255,0.5));
strokeWeight(40);
for (var i = 0; i <= 330; i=i+30) {
if (i!=angle) {
point(200+150*Math.cos(i*Math.PI/180), 200+150*Math.sin(i*Math.PI/180));
}
}
angle=(angle+30)%360;
}
Bullseye
Draw a bullseye.
// Draw a bullseye.
stroke("black");
strokeWeight(400);
point(200, 200);
stroke("lightgray");
strokeWeight(325);
point(200, 200);
stroke("blue");
strokeWeight(250);
point(200, 200);
stroke("red");
strokeWeight(175);
point(200, 200);
stroke("yellow");
strokeWeight(100);
point(200, 200);
Syntax
point(x, y)
Parameters
Name | Type | Required? | Description |
---|---|---|---|
x | Number | The x-location in pixels of the point. Should be a number from 0 to 400, but negative numbers will draw the point to the left of the display and numbers greater than 400 will draw the point to the right of the display (possibly unseen). | |
y | Number | The y-location in pixels of the point. Should be a number from 0 to 400, but negative numbers will draw the point above the display and numbers greater than 400 will draw the point below the display (possibly unseen). |
Returns
Tips
- If you're having trouble getting a point to show up, make sure that
noStroke()
hasn't been called, and where you're trying to draw the point fits within the coordinates of the display (400 x 400). - Anything you draw will overlap previous things you drew. The sequence of drawing statements is usually important.
- The default stroke is black, the default stroke weight is 1 pixel. Change the width and color of subsequent points using
strokeWeight()
andstroke()
.
Found a bug in the documentation? Let us know at support@code.org.