3D Key Controls

Actionscript:
  1. [SWF(backgroundColor=0x000000, width=500, height=500)]
  2. var hsw:Number = stage.stageWidth / 2;
  3. var hsh:Number = stage.stageHeight / 2;
  4. var pointNum:int = 300;
  5. var points3D:Vector.<Number> = new Vector.<Number>();
  6. var points2D:Vector.<Number> = new Vector.<Number>();
  7. var uvts:Vector.<Number> = new Vector.<Number>();
  8. var sorted:Array = [];
  9. var pnt:Point = new Point();
  10. var m:Matrix3D = new Matrix3D();
  11. var v:Vector3D = new Vector3D();
  12. for (var i:int = 0; i<pointNum; i++){
  13.     v.x = 300;
  14.     v.y = v.z = 0;
  15.     m.identity();
  16.     m.appendRotation(Math.random()*360, Vector3D.X_AXIS);
  17.     m.appendRotation(Math.random()*360, Vector3D.Y_AXIS);
  18.     m.appendRotation(Math.random()*360, Vector3D.Z_AXIS);
  19.     v = m.transformVector(v);
  20.     points3D.push(v.x, v.y, v.z);
  21.     points2D.push(0,0);
  22.     uvts.push(0,0,0);
  23.     sorted.push(new Vector3D());
  24. }
  25. points3D.fixed = true;
  26. points2D.fixed = true;
  27. uvts.fixed = true;
  28. var p:PerspectiveProjection = new PerspectiveProjection();
  29. var proj:Matrix3D = p.toMatrix3D();
  30. var rx:Number = 0, ry:Number = 0;
  31. addEventListener(Event.ENTER_FRAME, onLoop);
  32. function onLoop(evt:Event):void {
  33.     var i:int, j:int;
  34.     m.identity();
  35.     if (key[Keyboard.RIGHT]){
  36.         rx+=3
  37.     }else
  38.     if (key[Keyboard.LEFT]){
  39.         rx-=3
  40.     }else
  41.     if (key[Keyboard.UP]){
  42.         ry-=3
  43.     }else
  44.     if (key[Keyboard.DOWN]){
  45.         ry+=3
  46.     }
  47.     m.appendRotation(rx, Vector3D.Y_AXIS);
  48.     m.appendRotation(ry, Vector3D.X_AXIS);
  49.     m.appendTranslation(0, 0, 1000);
  50.     m.append(proj);
  51.     Utils3D.projectVectors(m, points3D, points2D, uvts);
  52.     for (i = 0, j = 0; i<points2D.length; i+=2, j++){
  53.         sorted[j].x = points2D[i] + hsw;
  54.         sorted[j].y = points2D[i + 1] + hsh;
  55.         sorted[j].z = uvts[j * 3 + 2];
  56.     }
  57.     sorted.sortOn("z", Array.NUMERIC);
  58.     graphics.clear();
  59.     graphics.lineStyle(2, 0x000000, 0.1);
  60.     for(i = 0; i<sorted.length; i++){
  61.         var zpos:Number = sorted[i].z * 12000;
  62.         var c:int = zpos * 14;
  63.         c = (c> 255) ? 255 : c;
  64.         graphics.beginFill(100<<16 | 100 <<8 |c);
  65.         graphics.drawCircle(sorted[i].x, sorted[i].y,zpos);
  66.         graphics.endFill();
  67.     }
  68. }
  69.  
  70. // permanently applies the matrix to the points3D vector
  71. function applyTransform():void{
  72.     m.identity();
  73.     m.appendRotation(rx, Vector3D.Y_AXIS);
  74.     m.appendRotation(ry, Vector3D.X_AXIS);
  75.     var temp:Vector.<Number> = new Vector.<Number>();
  76.     m.transformVectors(points3D, temp);
  77.     points3D = temp;
  78.     points3D.fixed = true;
  79.     rx = 0, ry = 0;
  80. }
  81.  
  82. // basic key setup
  83. var key:Object = new Object();
  84. stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyPressed);
  85. stage.addEventListener(KeyboardEvent.KEY_UP, onKeyReleased);
  86. function onKeyPressed(evt:KeyboardEvent):void {
  87.     key[evt.keyCode] = true;
  88.     key.keyCode = evt.keyCode;
  89. }
  90. function onKeyReleased(evt:KeyboardEvent):void {
  91.   applyTransform();
  92.   key[evt.keyCode] = false;
  93. }

In response to Thomas Francis's question, this snippet takes the Simple z-sorting snippet and shows how one might go about adding some basic key controls to it. It works by permanently applying x and y rotation transformations to the set of 3D points every time a key is released.

Check out the swf...

If you need to be able to rotate on both the x and y axis at the same time - and just need more flexibility... one way to do it would be to use quaternions - which may be tricky - but there are plenty of examples out there in java, processing and C/C++ just waiting to be ported (been on the todo list for some time actually).

Haven't been posting every day because I've been out of the country and away from my computer... have a backlog of snippets that need to be cleaned up and put in the pipeline...

This entry was posted in 3D, Graphics, Vector, keys and tagged , , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

2 Comments

  1. Posted August 30, 2009 at 10:31 am | Permalink

    I found that if you wanted to rotate on both x and y, just remove the “else”’s from the key detection, and then call this function:
    applyTransform();
    after you modify the rx/ry values

    Example:
    if (key[Keyboard.RIGHT]){
    rx-=3;
    applyTransform();
    }
    if (key[Keyboard.LEFT]){
    rx+=3;
    applyTransform();
    }
    if (key[Keyboard.UP]){
    ry-=3;
    applyTransform();
    }
    if (key[Keyboard.DOWN]){
    ry+=3;
    applyTransform();
    }

    seems to work fairly, it’s jumps a bit though, but i think that might be because of the applyTransform(); in the key up listener…

  2. Posted August 30, 2009 at 1:47 pm | Permalink

    good idea thomas, yeah you can get rid of the jumpiness by removing applyTransform from the key up and doing this:
    // from start of loop
    var i:int, j:int;
    if (key[Keyboard.RIGHT]){
    rx+=3
    applyTransform()
    }
    if (key[Keyboard.LEFT]){
    rx-=3
    applyTransform()
    }
    if (key[Keyboard.UP]){
    ry-=3
    applyTransform()
    }
    if (key[Keyboard.DOWN]){
    ry+=3
    applyTransform()
    }
    m.identity();
    m.appendTranslation(0, 0, 1000);
    m.append(proj);
    //m.appendRotation(rx, Vector3D.Y_AXIS);
    //m.appendRotation(ry, Vector3D.X_AXIS);

    Utils3D.projectVectors(m, points3D, points2D, uvts);
    … etc…

    making sure to remove appendRotation from the loop and doing all matrix stuff after the key controls…

One Trackback

  1. [...] 3D Key Controls [...]

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*