ProjectedQuads source code

ProjectedQuads
On request from several people I decided to finally release source code of my projection mapping projects. I wanted to make a Processing library from it anyway at some point but I delayed it so many times that it might never happen.

Features

- unlimited number of quads
- support for static images and dynamic generative animations
- loading and saving configuration to a text file

Download

ProjectedQuadsTest.zip [7kb]

How to use it?

Let’s say we want to display an image with perspective correction. First declare variables for our image and quad that will display it.

PImage img;
ProjectedQuads projectedQuads;

Then in setup() function load the image, create projectedQuads object, set number of quads and assign textures to them.

void setup() {
img = loadImage("checker.png");
projectedQuads = new ProjectedQuads();
projectedQuads->setNumQuads(1);
projectedQuads.getQuad(0).setTexture(img);
}

All we have to do in draw() function is just call projectedQuads.draw();

void draw() {
projectedQuads.draw();
}

Run the sketch and adjust corners of the quad using mouse or keyboard. Attached example source code explains how to use more quads and display dynamic graphic generated in processing.

Some other projects that I use this code for:

- “3xI” reactive projection mapping during Vivisesja festival. Read more about it on my blog.

3xI

- During Shiftcontrol’s end of they year meeting I did small projections to add some life to the globetrotters pub where it took place.

Tags: , ,

3 Responses to “ProjectedQuads source code”

  1. ujjval says:

    martino, this is awesome.
    i will try and understand the code and do something with it soon.
    thanks a lot.

  2. keebOo says:

    hi, nice work!
    I just download the code and try it.

    First try was to create an ellipse passing from quad to another:
    - there is a simple way to do it?

    (without checking the position each frame and choosing where draw it?)

    Thanks a lot in advance,

    bye.

  3. Marcin Ignac says:

    The easiest way to do it would be to draw the ellipse twice in two graphics objects . Let’s say your graphics size is W x H. Then in the first one you draw ellipse at (x,y) and in the second one you draw it at (x-W, H). When the ellipse reach the right border of the first quad it will start to appear in the second one. I hope it makes sense. The code doesn’t support splitting one texture among many quads yet. So that the only option to do it now.

Leave a Reply