Fix Z-Sorting Issues Using Viewport Layers

viewport-layer

download-source

Take a look at the sphere on the left. Ever had this happen to you and wondered if there was a good way to get rid of it? One of the ways we use is by adding a viewport layer. This works much the same as adding a new layer in flash or adding movieclip over another in AS3.

The best thing about this approach is that it’s very simple and quick to implement:

viewportLayer = viewport.getChildLayer(sphere, true);
viewportLayer.addDisplayObject3D(sphere);

For even more in depth discussion on viewport layers take a look at:
http://blog.zupko.info/?p=129

Here is the full class:

package  
{
	import flash.events.Event;
	import org.papervision3d.materials.ColorMaterial;
	import org.papervision3d.objects.primitives.Plane;
	import org.papervision3d.objects.primitives.Sphere;
	import org.papervision3d.view.BasicView;
	import org.papervision3d.objects.primitives.Cone;
	import org.papervision3d.materials.BitmapFileMaterial;
	import org.papervision3d.view.layer.ViewportLayer;
 
	public class Main extends BasicView 
	{
		protected var sphere:Sphere
		protected var plane:Plane;
		protected var bitmapMaterial:BitmapFileMaterial;
		protected var colorMaterial:ColorMaterial;
		protected var viewportLayer:ViewportLayer;
		public function Main() 
		{
			super();
			createChildren();
			commitProperties();
			startRendering();
		}
		protected function createChildren():void 
		{
 
			//Create a new 3D object
			colorMaterial = new ColorMaterial(0x000000);
			bitmapMaterial = new BitmapFileMaterial("images/ourtex.jpg")
 
			//Create 3D Objects
			plane = new Plane(colorMaterial,1000,1000,5,5)
			sphere = new Sphere(bitmapMaterial, 50, 10,10);
 
 
			//Add to scene
			scene.addChild(plane);
			scene.addChild(sphere);
 
			//To see the z-sorting issue comment out these two lines
			viewportLayer = viewport.getChildLayer(sphere, true);
			viewportLayer.addDisplayObject3D(sphere);
		}
 
		protected function commitProperties():void 
		{
			//Set some properties
			sphere.scale = 4;
			sphere.pitch( -10);
			plane.rotationX = 60;
		}
		override protected function onRenderTick(event:Event = null):void 
		{
			super.onRenderTick(event);
 
			//Rotate
			sphere.yaw(1);
		}
	}
}

download-source

This entry was posted in Actionscript 3 Papervision, Papervision 3D, Source Code, Tutorials, Z-Sorting Issues and tagged , , , . Bookmark the permalink.

8 Responses to Fix Z-Sorting Issues Using Viewport Layers

  1. away4m says:

    it’s not solution for mixed objects z sorting problem .sphere always top of the plane and when rotating entire objects we will faced another big problem.We have to dynamicly sort this layers.

  2. Charlie says:

    True. This does not solve for all situations where z-sorting rears its ugly head. It is a solution. What solutions would you offer?

  3. ge5 says:

    this seems to do the trick/can anyone explain??
    http://kode80.com/2009/10/26/per-pixel-depth-clipping/

  4. Charlie says:

    @ge5 – What would you like explained?

  5. Alex Boia says:

    Is the call viewportLayer.addDisplayObject3D(sphere); really necessary?…Because as far as i can tell, the sphere is added to the layer when the layer is first created with viewport.getChildLayer :-?

  6. Charlie says:

    @Alex

    You are correct. You do not need to call addDisplayObject3D() on the object that you call getChildLayer because upon creating the layer we are adding the sphere. Where would need to call addDisplayObject3D is when you want to add more objects to that viewport layer.

  7. Pingback: Fixing Z-sorting in Papervision 3D at Jozef Chúťka's blog

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>