labs.boulevart

Papervision rocks, that’s for sure! But trying to change a 3D Object’s registration or pivot point without any documentation doesn’t rock that hard (or maybe a little, because I was banging my head against the wall trying to do this).

If you are a developer and reading this post you probably want to do something like rotate an object around a world point instead of the local 3D Object’s registration point (which defaults at 0, 0, 0). Also, there aren’t any properties to change the default registration point so we have to create a new registration point that replaces our old registration point.

The solution is really easy as hell (look at the working example here), the only thing you have to do is put your object (let’s say you made a cube) in a new 3D object (the wrapper) and offset your cube x, y, z coordinates to something else than 0, 0, 0. After you placed your cube (or cubes in my example) in this new wrapper object, rotate the wrapper and it will look like the cube is rotation around a new registration point.

Just look at the code and everything will become clear:

// create the cubes
cube01 = new Cube(materialsList, 60, 60, 60, 1, 1, 1);
cube02 = new Cube(materialsList, 60, 60, 60, 1, 1, 1);

cube01.rotationY = 20;
cube01.rotationZ = 20;
cube01.x = 350;

cube02.rotationX = 20;
cube02.rotationY = 20;
cube02.x = 500;

// add the cubes to a new wrapper object
objectContainer = new DisplayObject3D();
objectContainer.addChild(cube01);
objectContainer.addChild(cube02);

scene.addChild(objectContainer);

onEnterFrame for updating the rotation:

// rotate the container
objectContainer.rotationY += 1;

// render the scene
scene.renderCamera(camera);

If you don’t like using a wrapper you can try to change multiple parameters at the same time to fake the effect that your cube has a new registration point. i.e.: you can change the Y rotation of the cube and move the X position at the same time. I can’t really give you a concrete mathematical calculation but I’m sure you’ll find this freaky things somewhere on the Internet.

Download source here

This post relates to a previous article: “Change a Papervision cube its material at runtime”

So you want to replace your cube’s sides with some fresh BitmapData? At runtime?

As you probably noticed before, there isn’t much of a reference on the Internet explaining on how to change the material of a cube (or any other 3D DisplayObject) in PaperVision3D.

You probably already know that you can assign wonderful materials like ColorMaterial, BitmapMaterial, etc to a cube by using a MaterialsList in its constructor.
But what should we do if we want to change the material after the cube has already been created?

The first thing you’d tried is to reapply the cube’s materials property (cube.materials = myNewMaterialsList) but you’ll notice that won’t work.
After looking for a few days I found the solution on how to reapply a new material (it has some limitation though).

The rescuing phrase:
cube.materials.getMaterialByName("front").bitmap = image;

Where “image” is a BitmapData Object.
Before you test this, keep in mind that there are a few limitations before this actually works (I don’t think its meant to be used like this)

Keep in mind that you are changing the side of the cube to a new bitmap so in the constructor of the cube: define the material of the side you want to change as BitmapData.

The code I used (there are several possibilities to do this):

var defaultFrontMaterial:BitmapMaterial = new BitmapMaterial(new BitmapData(267, 375, false, 0xFFFFFF));
defaultFrontMaterial.smooth = true;
defaultFrontMaterial.doubleSided = false;

var defaultBackMaterial:BitmapMaterial = new BitmapMaterial(new BitmapData(267, 375, false, 0xFFFFFF));
defaultBackMaterial.smooth = true;
defaultBackMaterial.doubleSided = false;

// Materials
materials = new MaterialsList(
{
front: defaultFrontMaterial,
back: defaultBackMaterial,
right: new ColorMaterial(0xFFFFFF, 1),
left: new ColorMaterial(0xFFFFFF, 1),
top: new ColorMaterial(0xFFFFFF, 1),
bottom: new ColorMaterial(0xFFFFFF, 1)
} );

The default material you are about to create for the cube’s front side should have the same dimension of that particular side. If you try to make the new BitmapData with a height and width of 1px and a solid color, you’ll end up with a rescaled image when you try to reapply the new material. (You might think: this default BitmapData side won’t display an image so why wouldn’t I make it 1px by 1px, but that’s a wrong thought :p).

And that’s it! I hope this method works for your particular case. This technique also works perfectly if the side has multiple faces (segments).

Many thanks to my collegues for supporting me and many thanks to PaperVision developers for the great API but let’s all hope they’ll make setters for applying new materials at runtime.