Benros_Object
Running code...
Restart
View-only mode, changes are not saved.
Shapes
- rect(x, y, w, h);Draws a rectangle, using the first two coordinates as the top left corner and the last two as the width/height
- ellipse(x, y, w, h);Draws an ellipse, using the first two parameters as the center coordinates and the last two as the width/height
- triangle(x1, y1, x2, y2, x3, y3);Draws an triangle between three points
- line(x1, y1, x2, y2);Draws a line between two points
- point(x, y);Draws a point at the given coordinates
- arc(x, y, w, h, start, stop);Draws an arc between two angles
- bezier(x1, y1, cx1, cy1, cx2, cy2, x2, y2);Draws a bezier curve between two points. To extract points and tangents after drawing the curve, use bezierPoint() and bezierTangent()
- quad(x1, x2, y2, x3, y3, x4, y4);Draws a quadrilateral between four points
Complex Shapes
- beginShape() / endShape() / vertex()Use beginShape() and endShape() to create more complex shapes. To start a shape, call beginShape(), then call the vertex() command, then call endShape() to stop. By default, it creates an irregular polygon, but you can control that by sending a mode to beginShape().
- curveVertex()Use curveVertex() to create a curved shape. It's used in conjunction with the bezierVertex() command.
- bezierVertex()Use bezierVertex() to create a bezier curve. It's used in conjunction with the curveVertex() command.
Colors
- background(r, g, b);Sets the background color of the canvas
- fill(r, g, b);Sets the fill color of the shape
- noFillRemoves the fill color of the shape
- stroke(r, g, b);Set the outline color for shapes
- strokeWeight(thickness);Change the thickness of lines and outlines.
- noStrokeRemoves the outline color of the shape
- color(r, g, b);Store a color in a variable
- blendColor(c1, c2, mode);Blend two colors together
- lerpColor(c1, c2, amount);Interpolate between two colors
Text
- text(string, x, y);Draws text to the canvas
- textSize(size);Change the size of the text
- textFont(font, size);Change the font of the text
Transform
- rotate(angle);Rotate shapes by an angle
- scale(factor);Scale shapes by a factor
- translate(x, y);Translates shapes by an offset
Environment
- width / heightThe size of the canvas
- draw = function() {...}Called repeatedly during program execution
Mouse
- mouseXThe x-coordinate of the mouse
- mouseYThe y-coordinate of the mouse
- pmouseXThe previous x-coordinate of the mouse
- pmouseYThe previous y-coordinate of the mouse
- mouseButtonWhich mouse button is pressed
- mouseIsPressedWhether the mouse is pressed
- mouseClicked() = function() {...}Called when mouse is clicked
- mousePressed() = function() {...}Called when mouse is pressed
- mouseReleased() = function() {...}Called when mouse is released
- mouseMoved = function() {...}Called when mouse is moved
- mouseDragged() = function() {...}Called when mouse is dragged
- mouseOver() = function() {...}Called when mouse is over
- mouseOut() = function() {...}Called when mouse is out
Keyboard
- keyThe value of the key pressed
- keyCodeThe code of the key pressed
- keyIsPressedWhether a key is currently pressed
- keyPressed() = function() {...}Called when a key is pressed
- keyReleased() = function() {...}Called when a key is released
- keyTyped() = function() {...}Called when a key is typed
Math
- random(low, high);Generate a random number
- dist(x1, y1, x2, y2);Calculates the distance between two points
- constrain(value, low, high);Constrain value between min and max
- min(num1, num2);Return the minimum of two numbers
- max(num1, num2);Return the maximum of two numbers
- abs(num);Return the absolute value of a number
- log(num);Take the logarithm of a number
- pow(num, exponent);Raise a number to an exponent
- sq(num);Square a number
- sqrt(num);Find the square root of a number
- round(num);Round a number to the nearest whole number
- ceil(num);Return nearest integer of greater/equal value
- floor(num);Return nearest integer of lesser/equal value
- PVector(x, y);An object that describes a 2-dimensional vector
Trigonometry
- cos(angle);Take the cosine of an angle
- sin(angle);Take the sine of an angle
- tan(angle);Take the tangent of an angle
Datetime
- day() / month () / year()Current date
- hour() / minute() / second()Current time
- millis()Milliseconds elapsed since program start
Debug
- debug(arg1, arg2, ...)Print to your browser's developer console
- println(data)Print the canvas console
- print(data)Print to the canvas console
Javascript
- var fooBar = function() {...}Define a new function
- var array = [0, 1, 2, 3, 4]Define a new array
- if (x < 20) {...}Only run code if a certain condition is true
- for (var i = 0; i < 10; i++) {...}Run code a certain number of times
- while (x < 250) {...}Run code while a certain condition is true