Problem with Pseudo 3D Projection

[Zentek]

Hello to all of you,
I am new here and wanted to ask something specific in this forum about my code in QB64.
So my code for a simple pseudo 3D projection is the following:

Code: QB64: [Select]

1. REM 3D Test Suite
2. REM (C) Christoph Petsch
3. REM TODO: clipping of lines
4.  
5. SCREEN 12
6. _FULLSCREEN
7. IF _FULLSCREEN = 0 THEN _FULLSCREEN _OFF
8.  
9. mdx = 160: mdy = 100 ' The Middle of the screen
10. wheight = 80 ' our wall height
11.  
12. ' lines start and end + player position
13. px = 0: py = 0
14. ' lines will be in an array
15. DIM wall(5, 4) AS INTEGER
16. wall(1, 1) = -10: wall(1, 2) = 10: wall(1, 3) = 1: wall(1, 4) = 10
17. wall(2, 1) = 10: wall(2, 2) = 10: wall(2, 3) = 10: wall(2, 4) = -10
18. wall(3, 1) = 10: wall(3, 2) = -10: wall(3, 3) = 5: wall(3, 4) = -15
19. wall(4, 1) = -5: wall(4, 2) = -15: wall(4, 3) = -10: wall(4, 4) = -10
20. wall(5, 1) = -10: wall(5, 2) = -10: wall(5, 3) = -10: wall(5, 4) = 10
21. ' players angle
22. angle = 0
23. scale = 5
24. pi = 3.14159
25.  
26. DO
27.     FOR i = 1 TO 5
28.         ' here goes the action now
29.         ' transform the wall into players position
30.         wx1 = wall(i, 1): wy1 = wall(i, 2): wx2 = wall(i, 3): wy2 = wall(i, 4)
31.         tx1 = wx1 - px: ty1 = wy1 - py: tx2 = wx2 - px: ty2 = wy2 - py
32.         ' rotate this
33.         rx1 = tx1 * COS(-angle) - ty1 * SIN(-angle)
34.         ry1 = tx1 * SIN(-angle) + ty1 * COS(-angle)
35.         rx2 = tx2 * COS(-angle) - ty2 * SIN(-angle)
36.         ry2 = tx2 * SIN(-angle) + ty2 * COS(-angle)
37.         ' now we know the start and end point
38.         PSET (mdx, mdy), 15
39.         LINE (mdx + rx1, mdy + ry1)-(mdx + rx2, mdy + ry2), 15
40.         ' draw the line around the player
41.         ' now we have our static player and the rotated map
42.         ' next thing to do is now project the 2d point to a 3d space
43.  
44.         REM ******************** 3D Projection ************************
45.         REM Formula is quite simple
46.         REM Use ry as scaling factor ... zx1 = rx1/ry1
47.         REM upper and lower will be calculated with zu1 = wheight / ry1
48.  
49.  
50.         ' render nothing behind us
51.         IF rx1 <= 0 AND rx2 <= 0 THEN GOTO notrender
52.         ' Clip the lines if one is partially behind the player
53.         ' this will be done with intersection calculation
54.  
55.         IF rx1 <= 0 OR rx2 <= 0 THEN
56.             ' clip the line at y-axis
57.             iy = (rx1 * ry2 - rx2 * ry1) / (rx1 - rx2)
58.             IF rx1 <= 0 THEN rx1 = 0.01: ry1 = iy
59.             IF rx2 <= 0 THEN rx2 = 0.01: ry2 = iy
60.         END IF
61.  
62.         ' Calculations here
63.         zx1 = -ry1 * scale / rx1
64.         zu1 = wheight / rx1
65.         zd1 = -zu1
66.         zx2 = -ry2 * scale / rx2
67.         zu2 = wheight / rx2
68.         zd2 = -zu2
69.  
70.         ' draw the lines
71.         LINE (mdx + zx1, mdy + zu1)-(mdx + zx2, mdy + zu2), 14
72.         LINE (mdx + zx1, mdy + zd1)-(mdx + zx2, mdy + zd2), 14
73.         LINE (mdx + zx1, mdy + zu1)-(mdx + zx1, mdy + zd1), 6
74.         LINE (mdx + zx2, mdy + zu2)-(mdx + zx2, mdy + zd2), 6
75.  
76.         notrender:
77.     NEXT i
78.     a$ = INKEY$
79.     SELECT CASE a$
80.         CASE "q"
81.             END
82.         CASE "w"
83.             CLS
84.             px = px + 0.2 * COS(angle)
85.             py = py + 0.2 * SIN(angle)
86.         CASE "s"
87.             CLS
88.             px = px - 0.2 * COS(angle)
89.             py = py - 0.2 * SIN(angle)
90.         CASE "a"
91.             CLS
92.             angle = angle + 0.01
93.         CASE "d"
94.             CLS
95.             angle = angle - 0.01
96.         CASE "j"
97.             ' Strafe
98.             CLS
99.             px = px - 0.2 * COS(-angle + 0.5 * pi)
100.             py = py - 0.2 * SIN(-angle + 0.5 * pi)
101.         CASE "l"
102.             CLS
103.             px = px + 0.2 * COS(-angle + 0.5 * pi)
104.             py = py + 0.2 * SIN(-angle + 0.5 * pi)
105.         CASE ELSE
106.             'do nothing
107.     END SELECT
108.  
109. LOOP
110.  
111.  

So this little program just projects a 2d map with some sense of depth onto the screen. It works in fact but it renders a terrible picture...
It seems like some warp effect I can't get rid of (you will see it yourself) also the intersection calculation is just a snipped from github and I don't really understand what it does... (if someone has an idea, what this actually does in terms of math (it just calculates the intersection point with the y axis))

So thank you if you find the time to answer my (maybe stupid) question.

Greetings

[_vince]

I tried it, pretty interesting

[bplus]

Code: QB64: [Select]

1. Screen 12
2. '_FullScreen   >> no full screen until debugged
3. 'If _FullScreen = 0 Then _FullScreen _Off
4.  
5. mdx = 160: mdy = 100 ' The Middle of the screen >> not for screen 12 maybe screen 13?

Hi Zentek welcome to forum, I just took a look at your code.

Warping might be from poor scaling but middle doesn't look right for screen 12, looks like screen 13.

[Zentek]

Yeah excuse me, I did some errors.
I also already solved the problem by simply using my good ol' math skillz ;)
Its just the intersection with the y-axis and in fact this can be calculated by the slope (you calculate for a linear function y = mx+n the case x = 0 => n = intersection point)

You will find a first working demo. At the moment I implement PAINT to work correctly and then clipping, also sectors for different heights are implemented at the moment)

Code: QB64: [Select]

1. SCREEN _NEWIMAGE(1280, 720, 256)
2. _FULLSCREEN
3. IF _FULLSCREEN = 0 THEN _FULLSCREEN _OFF
4.  
5. mdx = 1280 / 2: mdy = 720 / 2 ' The Middle of the screen
6. wheight = 500 ' our wall height
7. pheight = 0
8.  
9. ' lines start and end + player position
10. px = 0: py = 0
11. ' lines will be in an array
12. DIM wall(5, 6) AS INTEGER
13. wall(1, 1) = -10: wall(1, 2) = 10: wall(1, 3) = 10: wall(1, 4) = 10: wall(1, 5) = 10: wall(1, 6) = -1000
14. wall(2, 1) = 10: wall(2, 2) = 10: wall(2, 3) = 10: wall(2, 4) = -10: wall(2, 5) = 20: wall(2, 6) = 0
15. wall(3, 1) = 10: wall(3, 2) = -10: wall(3, 3) = 5: wall(3, 4) = -15: wall(3, 5) = -20: wall(3, 6) = 0
16. wall(4, 1) = -5: wall(4, 2) = -15: wall(4, 3) = -10: wall(4, 4) = -10: wall(4, 5) = -5: wall(4, 6) = 0
17. wall(5, 1) = -10: wall(5, 2) = -10: wall(5, 3) = -10: wall(5, 4) = 10: wall(5, 5) = 10: wall(5, 6) = 0
18. ' players angle
19. angle = 0
20. scale = 100
21. pi = 3.14159
22. fwd = 0: bwd = 0: left = 0: right = 0: strafel = 0: strafer = 0: scaler = 0
23. DO
24.     FOR i = 1 TO 5
25.         ' here goes the action now
26.         ' transform the wall into players position
27.         wx1 = wall(i, 1): wy1 = wall(i, 2): wx2 = wall(i, 3): wy2 = wall(i, 4)
28.         tx1 = wx1 - px: ty1 = wy1 - py: tx2 = wx2 - px: ty2 = wy2 - py
29.         ' rotate this
30.         rx1 = tx1 * COS(-angle) - ty1 * SIN(-angle)
31.         ry1 = tx1 * SIN(-angle) + ty1 * COS(-angle)
32.         rx2 = tx2 * COS(-angle) - ty2 * SIN(-angle)
33.         ry2 = tx2 * SIN(-angle) + ty2 * COS(-angle)
34.         ' now we know the start and end point
35.         PSET (mdx, mdy), 15
36.         LINE (mdx + rx1, mdy + ry1)-(mdx + rx2, mdy + ry2), 15
37.         ' draw the line around the player
38.         ' now we have our static player and the rotated map
39.         ' next thing to do is now project the 2d point to a 3d space
40.  
41.         REM ******************** 3D Projection ************************
42.         REM Formula is quite simple
43.         REM Use ry as scaling factor ... zx1 = rx1/ry1
44.         REM upper and lower will be calculated with zu1 = wheight / ry1
45.  
46.  
47.         ' render nothing behind us
48.         IF rx1 <= 0 AND rx2 <= 0 THEN GOTO notrender
49.         ' Clip the lines if one is partially behind the player
50.         ' this will be done with intersection calculation
51.  
52.         IF rx1 <= 0 OR rx2 <= 0 THEN
53.             ' clip the line at y-axis
54.             iy = ry1 - (ry1 - ry2) / (rx1 - rx2) * rx1 ' line intersection calculation with simple linear function y = 0
55.             IF rx1 <= 0 THEN rx1 = 0.01: ry1 = iy
56.             IF rx2 <= 0 THEN rx2 = 0.01: ry2 = iy
57.         END IF
58.  
59.         ' Calculations here
60.         zx1 = -ry1 * scale / rx1
61.         zd1 = -wheight / rx1 - wall(i, 5) / rx1 - pheight
62.         zu1 = wheight / rx1 - wall(i, 6) / rx1 - pheight
63.         zx2 = -ry2 * scale / rx2
64.         zd2 = -wheight / rx2 - wall(i, 5) / rx2 - pheight
65.         zu2 = wheight / rx2 - wall(i, 6) / rx2 - pheight
66.  
67.         ' draw the lines
68.         'LINE (mdx * zx1 / 2 + mdx, mdy * zu1 / 2 + mdy)-(mdx * zx2 / 2 + mdx, mdy * zu2 / 2 + mdy), 14
69.         'LINE (mdx * zx1 / 2 + mdx, mdy * zd1 / 2 + mdy)-(mdx * zx2 / 2 + mdx, mdy * zd2 / 2 + mdy), 14
70.         'LINE (mdx * zx1 / 2 + mdx, mdy * zu1 / 2 + mdy)-(mdx * zx1 / 2 + mdx, mdy * zd1 / 2 + mdy), 6
71.         'LINE (mdx * zx2 / 2 + mdx, mdy * zu2 / 2 + mdy)-(mdx * zx2 / 2 + mdx, mdy * zd2 / 2 + mdy), 6
72.         ' draw the lines
73.         LINE (zx1 + mdx, zu1 + mdy)-(zx2 + mdx, zu2 + mdy), 14
74.         LINE (zx1 + mdx, zd1 + mdy)-(zx2 + mdx, zd2 + mdy), 14
75.         LINE (zx1 + mdx, zu1 + mdy)-(zx1 + mdx, zd1 + mdy), 6
76.         LINE (zx2 + mdx, zu2 + mdy)-(zx2 + mdx, zd2 + mdy), 6
77.  
78.         notrender:
79.     NEXT i
80.     LOCATE 1, 1: PRINT "Scale factor = "; scale
81.  
82.     ' modified key input to detect several keypresses
83.     _LIMIT 20
84.     kpress = _KEYHIT
85.     IF kpress = 18432 THEN fwd = 1
86.     IF kpress = -18432 THEN fwd = 0
87.     IF kpress = 20480 THEN bwd = 1
88.     IF kpress = -20480 THEN bwd = 0
89.     IF kpress = 19200 THEN left = 1
90.     IF kpress = -19200 THEN left = 0
91.     IF kpress = 19712 THEN right = 1
92.     IF kpress = -19712 THEN right = 0
93.     IF kpress = 97 THEN strafel = 1
94.     IF kpress = -97 THEN strafel = 0
95.     IF kpress = 100 THEN strafer = 1
96.     IF kpress = -100 THEN strafer = 0
97.     IF kpress = 27 THEN END
98.     IF kpress = 43 THEN scaler = 1
99.     IF kpress = -43 THEN scaler = 0
100.     IF kpress = 45 THEN scaler = -1
101.     IF kpress = -45 THEN scaler = 0
102.     IF fwd = 1 THEN px = px + 0.2 * COS(angle): py = py + 0.2 * SIN(angle): CLS
103.     IF bwd = 1 THEN px = px - 0.2 * COS(angle): py = py - 0.2 * SIN(angle): CLS
104.     IF left = 1 THEN angle = angle + 0.05: CLS
105.     IF right = 1 THEN angle = angle - 0.05: CLS
106.     IF strafel = 1 THEN px = px + 0.2 * COS(angle + 0.5 * pi): py = py + 0.2 * SIN(angle + 0.5 * pi): CLS
107.     IF strafer = 1 THEN px = px - 0.2 * COS(angle + 0.5 * pi): py = py - 0.2 * SIN(angle + 0.5 * pi): CLS
108.     IF scaler > 0 THEN scale = scale + 50: CLS
109.     IF scaler < 0 THEN scale = scale - 50: CLS
110. LOOP
111.  
112. REM  (rx1 * ry2 - rx2 * ry1)/(rx1 - rx2)
113.  
114.  

But obviously there are some problems with PAINT as when something is off the screen, it won't be rendered correctly ...

Have fun and stay tuned :)

[OldMoses]

I suspect the PAINT issue is with borders that don't "seal" correctly. I tried PAINT with a shape that was partially offscreen and it worked alright, although I found the border color parameter is not so "optional" as the wiki suggests. If I didn't control the border colors, it would paint the whole screen.

Code: QB64: [Select]

1. SCREEN _NEWIMAGE(400, 400, 32)
2. LINE (-200, -200)-(200, 200), &HFFFFFFFF, B
3. PAINT STEP(-20, -20), &HFFFF0000, &HFFFFFFFF
4. LINE (250, 250)-(300, 300), &HFFFFFFFF, B
5. PAINT STEP(-10, -10), &HFFFF0000, &HFFFFFFFF
6.  
7.