A Flash Developer Resource Site

Results 1 to 7 of 7

Thread: 3d depth of field

  1. #1
    Member
    Join Date
    May 2004
    Location
    Hamburg / Germany
    Posts
    30

    3d depth of field

    i'm having trouble projecting a simple movement of a ball for a pong-style game from 2d to 3d. the code i'm currently using simply stretches the movement along the axis so that a 2d rectangle (the turf) becomes a parallelogram in 3d. but that does not make for perspectivical distortion (i want the far side of the turf to be shorter than the close side). i really have no clue how to do this cos deflection angles would have to be adjusted also.
    this is the relevant passage of code

    Code:
    onClipEvent (load) {
    	moveX = 5;
    	moveY = 2;
    	moveZ = 0;
    	XPos = 0;
    	YPos = 0;
    	ZPos = 0;
    	x = this._x;
    	y = this._y;
    }
    
    
    
    
    onClipEvent (enterFrame) {
    	
    
    
    if (moveX != 0) {
    	this._x += moveX;
    	this._y += (moveX*0.7);
    	XPos += moveX;
    	}
    if (moveY != 0) {
    	this._x += moveY;
    	this._y -= (moveY*0.15);
    	YPos += moveY;
    	}
    	
    
    
    // deflection off borders
    if (XPos>=250 || XPos<0) {
    	moveX *= -1;
    	}
    if (YPos>=200 || YPos<-10) {
    	moveY *= -1;
    	}
    
    
    //resizing of ball to simulate depth
    this._xscale = (this.XPos/4)+40;
    this._yscale = (this.XPos/4)+40;
    
    
    
    }


    i attached the source if you need to have look
    (the relevant code is inside the ball's actions)
    Attached Files Attached Files

  2. #2
    Senior Member
    Join Date
    Jul 2000
    Location
    Sydney, Australia
    Posts
    486
    you need to actually treat the movement as if it was in the 3 dimensions and so have x, y & z coordinates and then in flash we will create a fake 3d environment

    becuase flash has its origin it isnt really suited to this so set an xCenter and yCenter such that they are flash's equivalent

    i.e on a 800x600 movie
    code:

    xCenter = 400
    yCenter = 300



    select a focal length for your 3d decption, i have found that 100 is generally the best - this is at what depth you want your lens to be focused as if it was a camera

    now to work out the scale of the object:

    code:

    focal_length = 100
    scale = focal_length/(focal_length+z)



    therefore when the z coordinate is 0 you will have everything at its original size and increasing z decreases the size and vice versa

    code:

    _xscale = _yscale = scale*100 //shrinks or englardes the object



    as all measurements are stretched, so too is the distance from the center. therefore you need to create scaled versions of the x and y coordinates for this particular z value and then add them on to the center which is the vanishing point

    code:

    xScale = x*scale
    yScale = y*scale
    _x = xCenter+xScale
    _y = yCenter+yScale



    if you hadn't created the new centers then your vanishing point would be at the top left of the screen

    for your collisions, use the variables x, y & z and don't worry about the scaling because this is only to create the illusion

    code:

    if(x>=250 || x<=-250){
    moveX *= -1
    }


  3. #3
    Senior Member
    Join Date
    Jul 2000
    Location
    Sydney, Australia
    Posts
    486
    here is one that i made earlier this year in my never ending boring english and chemistry lessons

    i never really got to finish it because school's over now

    it hooks up to a mysql database you save high scores but i never got around to finishing the game off properly
    Attached Files Attached Files

  4. #4
    Senior Member
    Join Date
    May 2001
    Posts
    1,838
    Basically, this pong game is a 2d game. Usually we design our game 2d and plot the result onto a 3d model view. I think, it is more difficult to design a model 3d and then plot it 2d.

    Here is how we plot 3d view.

    Those constants are difficult to "solve". I just pick values to match your board as close as possible.

    I remove many elements in the movie. It contains only the necessary part for demonstration.
    Attached Files Attached Files
    • File Type: zip p3.zip (207.9 KB, 195 views)
    Last edited by ericlin; 10-24-2004 at 05:24 AM.

  5. #5
    Member
    Join Date
    May 2004
    Location
    Hamburg / Germany
    Posts
    30
    that is f*****g awesome!! thank you so much!
    you absolutly ROCK. i was about to abandon the idea cos i thought it was too complicated. you are the man!

  6. #6
    Senior Member
    Join Date
    Jul 2000
    Location
    Sydney, Australia
    Posts
    486
    www.bit-101.com

    actually this guy is the man he's got a whole heap of tutorials on 3d stuff and has made some really interesting stuff

  7. #7
    Senior Member
    Join Date
    May 2001
    Posts
    1,838
    I learned much from bit101.

    About the underlying Math, it is complicated. If you are interested and have patience, I wrote a page for you.

    http://ericlin2.tripod.com/f3d/pong3d.html

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center