Wednesday, June 18, 2008

Papervision Offset / Scale UV

I started working on a Papervision project this week. I've experimented before and had gone through the tutorials on Papervision2 and GotoAndLearn (both of which where a great help), but this is my first "official" papervision project.

Almost immediately my first hurdle was trying to figure out how to manipulate material on planes. By default the material fills the entire plane no matter what, but I wanted to use 1 material on multiple planes and have each plane show a different section of the material. I could easily cut up a bitmap and use that, however the project called for a Video so that option was clearly out. Basically I needed a function to scale and offset the material.

After digging through the API and scouring the Forum I eventually found out that each plane is made up of 2 faces. Each face is a triangle and has 3 vertexes and 3 uv values. By looping through both faces and each vertex and changing their uv values one by one I was able to scale/offset the entire plane's uv.

The following code snippet shows the general idea:

var geo:GeometryObject3D = plane.geometry;
var face:Triangle3D = geo.faces[0];

var left:Number = .5;
var right:Number = 1;
var top:Number = 1;
var bottom:Number = .5;

var topLeft:NumberUV = new NumberUV(left,top);
var topRight:NumberUV = new NumberUV(right,top);
var bottomLeft:NumberUV = new NumberUV(left,bottom);
var bottomRight:NumberUV = new NumberUV(right,bottom);

var numberUV:NumberUV = face.uv0;
numberUV.u = bottomLeft.u;
numberUV.v = bottomLeft.v;

After this point you would continue to alter the other 2 uv values on the face (uv1, uv2) and then do the same for the remaining face.

UV values range from 0 to 1 (when the material is not tiled, it can be greater when tiled). By default the left value should be 0, the right value would be 1. By changing both the left and the bottom to .5 we should only see the top right corner of the material on the plane. Everything on the left half and bottom half would be cropped.

Let me know if you have an easier way to achieve the same effect. Would love to hear it.

I will post the project once it is complete.


Anonymous said...

Good stuff.

Drop by at irc server freenode #papervision3d
so you can get live help.

Anonymous said...

hi. i have the same problem. can i ask, did you find a way to solve it ?
how would you spread 1 material across all the faces of a box ?

Ickydime said...

I haven't found an easier way to do it since my post. So the only way I know would be to loop through and alter the UV values of each triangle on each face of the box you are using.

However, I haven't used Papervision in awhile and they could have an easier solution now. Ringo @ Flashbookmarks in the comment before yours mentions a chatroom that would be much more helpful than what I can offer. Check out the page here:

There are almost always experts in the room and they are very helpful. Good luck.

Daniel said...

Hello icky!
Your post was very helpfull to me, i've tried to break an imported dae into regions and have each region assigned a different MovieMaterial...

Got it working now thanx to you!

Have a nice weekend, & thanx again!!!