Transition from Processing to P5js

Reference: https://github.com/processing/p5.js/wiki/Processing-transition

ProcessingP5.jsComments
size()createCanvas()a sketch is more than the drawing canvas
frameRateframeRate()frameRate(num) sets the frame rate
preload()Typically used to preload images. E.g.
function preload()  {
img = loadImage(“assets/moonwalk.jpg”);
}
setup()Used to configure the application
function setup() {
createCanvas(640, 480);
}
mousePressedmouseIsPressed the variable is renamed
mouseX, mouseYtouchX, touchY New touch support that’s comparable to mouse support
mousePressed()touchStarted()
mousedDragged()touchMoved()
mouseReleased()touchEnded()
touches[] predefined array that contains a series of objects with x and y properties corresponding to the position of each finger
pushMatrix() / popMatrix()
pushStyle() / popStyle()
 push() / pop() combined matrix and style methods
 instance modeDefault: Global namespace.  Also has instance mode.  See  instance mode example and  global vs instance mode tutorial.

Leave a Comment