Papervision triangle plane field with blur

Home  /  Experiments  /   Papervision  /  Papervision triangle plane field with blur
September 18th, 2009  /  2 comments

Here is a sample to trying to get blur filter to work on papervision. The good thing is, it worked, that bad thing is, like all flash filters, it could drastically slow down your flash production if it is used on a mass scale. You can download the source at the very end of the post, and it’s quite short and self explainary. May your creative juice splatter all over:

triangle
(click to view sample via shadowbox)

Scripts:

package {

    import org.papervision3d.cameras.*;
    import org.papervision3d.events.InteractiveScene3DEvent;
    import org.papervision3d.materials.BitmapMaterial;
    import org.papervision3d.materials.utils.MaterialsList;
    import org.papervision3d.materials.ColorMaterial;
    import org.papervision3d.objects.primitives.*;
    import org.papervision3d.objects.special.*;
    import org.papervision3d.render.BasicRenderEngine;
    import org.papervision3d.scenes.Scene3D;
    import org.papervision3d.view.Viewport3D;
    import org.papervision3d.core.geom.renderables.*;
    import org.papervision3d.materials.special.*;
    import org.papervision3d.core.geom.*;
    import org.papervision3d.objects.*;
    import org.papervision3d.view.layer.BitmapEffectLayer;
    import org.papervision3d.view.layer.ViewportLayer;
    import org.papervision3d.view.layer.util.ViewportLayerSortMode;
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.filters.*;

    public class TriangleField extends Sprite {


        private var viewport:Viewport3D;
        private var scene:Scene3D = new Scene3D();
        private var camera:FreeCamera3D = new FreeCamera3D();
        private var renderer:BasicRenderEngine;
        private var _triNum:uint = 0;
        private const material1:ColorMaterial = new ColorMaterial(0xccce00);
        private const material2:ColorMaterial = new ColorMaterial(0xabad00);
        private const material3:ColorMaterial = new ColorMaterial(0x848500);
        private const material4:ColorMaterial = new ColorMaterial(0x0BE5FF);
        private const material5:ColorMaterial = new ColorMaterial(0x08a8bb);
        private var matCount:uint = 80;

        public function TriangleField() {
            viewport = new Viewport3D(750, 550, false, false);
            addChild(viewport);
            renderer = new BasicRenderEngine();
            camera.z = 0;
            camera.zoom = 4;
            addEventListener(Event.ENTER_FRAME, onEnterFrame);
        }
        public function onEnterFrame(e:Event):void {
            renderer.renderScene(scene, camera, viewport);
            camera.yaw(-2);
            //camera.pitch((240)*-0.002);
            //camera.x += speed*Math.sin(camera.rotationY*Math.PI/180);
        }
        public function init3D():void {
            material1.doubleSided = true;
            material2.doubleSided = true;
            material3.doubleSided = true;
            material4.doubleSided = true;
            material5.doubleSided = true;
            var sphere:Sphere = new Sphere(null, 20, 8, 10);
            var sphereFaces:Array = sphere.geometry.faces;
            for each (var sphereTriangle:Triangle3D in sphereFaces) {
                if(_triNum <= 100) {
                    var sphereTriangleVertices:Array = sphereTriangle.vertices;
                    var triangleVertices:Array = new Array();
                    for each (var sphereTriangleVertex3D:Vertex3D in sphereTriangleVertices) {
                        var vertex3D:Vertex3D = new Vertex3D(sphereTriangleVertex3D.x, sphereTriangleVertex3D.y, sphereTriangleVertex3D.z);
                        triangleVertices.push(vertex3D);
                    }
                    var triangle3D:Triangle3D = new Triangle3D(null, triangleVertices, material1, sphereTriangle.uv);
                    var triangleFaces:Array = [triangle3D];
                    //SIMPLE SETTINGS FOR MULTIPLE TRIANGLE COLORS
                    _triNum += 1;
                    if (_triNum <= 40) {
                        var triangleMesh3D:TriangleMesh3D = new TriangleMesh3D(material1, triangleVertices, triangleFaces, null);
                    } else if (_triNum <= 50) {
                        var triangleMesh3D:TriangleMesh3D = new TriangleMesh3D(material2, triangleVertices, triangleFaces, null);
                    } else if (_triNum <= 60) {
                        var triangleMesh3D:TriangleMesh3D = new TriangleMesh3D(material3, triangleVertices, triangleFaces, null);
                    } else if (_triNum <= 70) {
                        var triangleMesh3D:TriangleMesh3D = new TriangleMesh3D(material4, triangleVertices, triangleFaces, null);
                    } else {
                        var triangleMesh3D:TriangleMesh3D = new TriangleMesh3D(material5, triangleVertices, triangleFaces, null);
                    }
                    //SETTING END
                    triangle3D.instance = triangleMesh3D;
                    //TO RANDOMIZE THE POSITION OF EACH TRIANGLE
                    triangleMesh3D.x = Math.random() * 350 - 175;
                    triangleMesh3D.y = Math.random() * 350 - 175;
                    triangleMesh3D.z = Math.random() * 350 - 175;
                    //CUSTOM SETTING TO BLUR OUT TRIANGLE IF THEY APPEARED TOO FAR
                    if(triangleMesh3D.z > 100 || triangleMesh3D.z < -100) {
                        triangleMesh3D.createViewportLayer(viewport, false).filters = [new BlurFilter(8, 8, 4)];
                    }
                    triangleMesh3D.rotationY = Math.random() * 360 - (360 / 2);
                    triangleMesh3D.rotationX = Math.random() * 360 - (360 / 2);
                    scene.addChild(triangleMesh3D);
                }
            }
        }
    }
}

Download Link.

Here’s another way to play with it, it’s running too slow but I’m sure someday we’ll find some uses for it:
triangle2

Posted by FF Flash Geek Stumble it! * Twitter * Reddit * Digg * Delicious * Facebook
  1. October 4th, 2009 at 03:26 | #1

    Aloha,

    Sweet:)

    To make it fast with blur, pre-render the materials with blurlevels at start, for example 5 levels, then swap the material at runtime. Based on for example the Z position. It will be lightning fast.

    Here a old demo i did this way: http://www.flashbookmarks.com/demos/dofdemo2/

    Good luck.

  2. FF Flash Geek
    October 13th, 2009 at 19:02 | #2

    Very nice! That would be a simple fix for reducing filter rendering. Unfortunately it increases code execution does it not? Even so it’s a better alternative in this case. Thanks for the heads up Ringo, will implement it on future projects, it’s wonderful.

Responds

 
 
 
SEO Powered by Platinum SEO from Techblissonline