-
3D Help
Ok, so a while back I decided to challenge myself to create a working 3D engine without looking at any tutorials. I've got what I think is a pretty good prototype, but the z-axis is giving me some really odd behavior.
Here's my code (also, this is in AS2):
PHP Code:
var magic = 180/Math.PI;
function getA(x1,y1,z1,x2,y2,z2) {
var d = Math.sqrt((x2-x1)*(x2-x1)+(z2-z1)*(z2-z1));
var yd = y2-y1;
var r = Math.atan2(yd,d)*magic;
return r;
}
function aDist(a1,a2) {
var a = a2-a1;
if (a > 180) a -= 360;
else if (a < -180) a += 360;
return a;
}
p0 = [0,0,0];
p1 = [0,100,0];
p2 = [0,0,100];
p3 = [0,100,100];
p4 = [100,0,0];
p5 = [100,100,0];
p6 = [100,0,100];
p7 = [100,100,100];
p8 = [50,50,50];
var x = 50;
var y = 50;
var z = -50;
var xa = 0;
var ya = 0;
onEnterFrame = function() {
removeMovieClip(s);
createEmptyMovieClip("s",1);
if (Key.isDown(Key.UP)) z++;
if (Key.isDown(Key.DOWN)) z--;
if (Key.isDown(Key.LEFT)) x++;
if (Key.isDown(Key.RIGHT)) x--;
if (xa >= 360) xa = 0;
else if (xa < 0) xa = 359;
for (var n=0; _root["p"+n]; n++) {
p = _root["p"+n];
s.attachMovie("a","a"+n,n);
o = s["a"+n];
x2 = getA(y,x,z,p[1],p[0],p[2]);
y2 = getA(x,y,z,p[0],p[1],p[2]);
//x2 = aDist(x2,xa);
//y2 = aDist(y2,ya);
o._x = x2;
o._y = y2;
}
}
My problem is that whenever the z position gets within the box's depths, even when the camera is outside the box, the box seems to invert itself.
To explain my methodology a bit, I'm rendering any given object (or, as of now, point) by finding it's x&y angles relative to the position of the camera and then just using that angle as a strait up x/y position. There is no view limit right now, affording the player a 360 degree view around themselves.
In theory, this would mean that an x/y/z position of 50/50/-50 would render this box the same as -50/50/50. Yet while 50/50/-50 seems to render the box just fine, -50/50/50 renders it in a triangular shape.
I really can't wrap my head around why this would be happening, any ideas?
-
1 Attachment(s)
First off, I don't see you rotating the points in relation to the rotation of the camera...then again, have you even implemented camera rotation?
I'm not too sure about you're problem, but I think I can some what explain it (I had had this problem (if i understand yours correctly) when I made my engine):
--see picture--
After you read the picture:
The way to go around this is z-clipping, which will chop the intersecting line, and put a vertice closely in front of the viewing plane (never do: z = 0, because then you start dividing with 0, which will make it go whack).
I hope I understood your problem...?
P.
-
Ugh, I always do this. Solved my own problem fairly shortly after posting. But thanks for your reply Pazil!
Apparently my problem was in try to calculate the x and y positions using the same functions. I'm guessing I only have to deal with the z-axis once, and my old code dealt with it twice, causing the errors.
So my new code has separate function for finding the x and y positions. Now, I have have no idea how flawed this attempt may or may not be, but here's the code form my latest version for those interested:
PHP Code:
var magic = 180/Math.PI;
function getA(x1,y1,z1,x2,y2,z2) {
var d = Math.sqrt((x2-x1)*(x2-x1)+(z2-z1)*(z2-z1));
var yd = y2-y1;
var r = Math.atan2(yd,d)*magic;
return r;
}
function getAX(x1,z1,x2,z2) {
var zd = z2-z1;
var xd = x2-x1;
var r = Math.atan2(xd,zd)*magic;
return r;
}
p0 = [-50,-50,-50];
p1 = [-50,50,-50];
p2 = [-50,-50,50];
p3 = [-50,50,50];
p4 = [50,-50,-50];
p5 = [50,50,-50];
p6 = [50,-50,50];
p7 = [50,50,50];
p8 = [0,0,0];
var x = 50;
var y = 0;
var z = -50;
var xa = 0;
var ya = 0;
for (var n=0; _root["p"+n]; n++) {
_root["p"+n][3] = "0x"+random(10)+random(10)+random(10)+random(10)+random(10)+random(10);
}
onEnterFrame = function() {
removeMovieClip(s);
createEmptyMovieClip("s",1);
z = _ymouse-180;
x = _xmouse-180;
if (Key.isDown(Key.UP)) y++;
if (Key.isDown(Key.DOWN)) y--;
if (Key.isDown(Key.LEFT)) x++;
if (Key.isDown(Key.RIGHT)) x--;
if (xa >= 360) xa = 0;
else if (xa < 0) xa = 359;
for (var n=0; _root["p"+n]; n++) {
p = _root["p"+n];
s.attachMovie("a","a"+n,n);
o = s["a"+n];
var c = new Color(o);
c.setRGB(p[3]);
x2 = getAX(x,z,p[0],p[2])+180;
y2 = getA(x,y,z,p[0],p[1],p[2])+180;
o._x = x2;
o._y = y2;
}
}
-
just a question inbetween:
is your code above using: Quaternion?
http://en.wikipedia.org/wiki/Quaternion
-
Not as far as I know, or at least, I was unaware of using them if I did?
This is the first time I've even heard of Quaternion.