#Processing mouse coordinates how to

In 2D, translate looks like: 'translate(x,y)', and 3D we add one more argument: 'translate(x,y,z)'. Assuming, however, that you are already familiar with how translate() works in 2D, there isn't a lot to learn here beyond the addition of a single argument. In fact, there's an entire 2D transformations tutorial that I suggest you stop and read right now unless you are already comfortable with the concept of translation (and rotation) in Processing. Now, translate() is not exclusive to 3D sketches and is quite commonly used in 2D. In order to specify 3D coordinates for shapes in Processing, you have to use translate(). Our first instinct might be to add another argument to the rect() function. We know that to draw a rectangle, the rect() function takes four arguments: x location, y location, width, and height. Let's say we want to draw a rectangle that moves towards the viewer using P3D. In other words, positive is coming at you, negative is moving away from you. In Processing, the system is left-handed, as follows: It's left-handed if you use your left hand and do the same. Cartesian 3D systems are often described as 'left-handed' or 'right-handed.' If you point your index finger in the positive y direction (up) and your thumb in the positive x direction (to the right), the rest of your fingers will point towards the positive z direction. In order to draw something at a point in three dimensions the coordinates are specified in the order you would expect: x, y, z. You can no longer know exact pixel locations as you might with 2D shapes, because the 2D locations will be adjusted to create the illusion of 3D perspective.

You are drawing in 2D but want to use a particular graphic effect not available in default renderer! Some graphics functions are only available in P2D such as textures and lighting (see below).īefore we begin drawing in 3D, it's important to note that as soon as we give ourselves over to the illusion of 3D space, a certain amount of control must be relinquished to the P3D renderer.

In particular, using the new 'shape recording' functionality available in PShape (see PShape tutorial) can greatly increase speed in P3D mode.

Keep in mind that OpenGL is not magic pixie dust that makes any sketch faster (though it's close), you will also need to carefully consider the techniques you are using to make the drawing as well. In other words, some of the work required to draw all the pixels in the window can happen on your computer's graphics card which is often more efficient. You want your sketch to run faster! P2D and P3D make use of OpenGL-compatible graphics hardware.

#Processing mouse coordinates how to

How far in front or behind the window does a pixel live? Now, we all know there are no actual pixels floating in the air in front of or behind your screen! What we're talking about here is how to use the theoretical z-axis to create the illusion of three-dimensional space in your Processing window.P3D is required for this. You are drawing in 3D! In three-dimensional space, a third axis (the z-axis) refers to the depth of any given point.Switching to P2D or P3D is advisable given one of the following scenarios: It provides the most elegant and accurate results when drawing in 2D. In most cases, particularly when you are first learning Processing, you will want to use the default renderer setting. When deciding which renderer to use, you are balancing a number of factors: speed, accuracy, and general usefulness of the available features. For example, the default renderer employs existing Java (the language Processing.py is built on) 2D libraries to draw shapes, set colors, display text, etc. Now, you may be wondering: 'Which render mode should I choose and why?' The mode itself tells Processing what to do behind the scenes when drawing the display window. To use a non-default renderer, you can specify via the size() function. In Processing, there are many render modes: the default renderer, P2D, P3D, and PDF. This work is licensed under a Creative CommonsĪttribution-NonCommercial-ShareAlike 4.0 International License. If you see any errors or have comments, please This tutorial is for Processing's Python Mode.