Code-It-Yourself! 3D Graphics Engine Part #4 - Texturing & Depth Buffers

I've run into a problem where if I rotate the camera 180 degrees I see a completely black version of whatever I object I've loaded into the engine. Right now I just have the cube loaded. Everything else works fine. I can see the cube in front of the camera and it renders perfectly. However no matter how close or far I am from the cube (and no matter what direction I approach it from) if I rotate the camera 180 degrees and make it so the real cube is behind the camera I will see a black cube of the same size in front of me. It is almost like a mirror image of the real object, just black and flipped to the other side of the world X-axis. Does anybody know what the problem is or how to solve this? Thanks

It's anyone able to explain why the application is using ~2% CPU and 1mb memory but it's not running at a zillion fps?

Magnificent, absolutely magnificent

I've implemented this in Javascript just for fun and to see how far I can push pure Javascript and I am truly surprised by how smooth it went so far.
Up until the point where I started texture sampling, I've got some pretty stable 60 FPS on my passive cooled MacBook Air M2 with some additional caching.
It is mindboggeling how fast CPUs are today and especially the M2. Even my core i9 from three years ago can't keep up.
With the texture sampling the perfomance shatters, but that's because drawing single pixels on a canvas is stupid slow, the DOM updates eat up 90% of the calculation.
Maybe I'll try to hardware accelerate this part, but I'm not sure how well this is going to go. I don't want to move larger parts of the implementation to WebGL.

Thanks a ton for this great video series ❤

There's a part 4 !!?? :D :D

Time to add RTX

Been studying 3d graphics for a while now everything in these videos made sense and a fantastic result, really helpful cheers!

I'm just here to thank you! All thanks to you I was able to write an 3D engine that's decent. I started with what you did in your videos, but now I'm improving it bit by bit. I'm working on lighting/shadows now, then I plan to improve it's performance, but thanks to you I might some day make my own 3D game. For real, you are awsome, and I'm kinda hooked up in your videos now. Again, thank you so much!

¿Javascript?

How did you draw pixel on the command prompt?

You are Jedy master man, thank a lot for the greath tutorial !!!!

I don't want complex 3d engine In my game, so is there something I can do with texturing when I only have 3d projection function?

This series is amazing! How would you go about implementing collision? I'm trying but slopes are being a nightmare

I've done it, I completed all episodes completely in C. I even made it able to import textured meshes!

Watched/read a lot of triangle texture mapping tutorials, and yours is the easiest to understand. Great work

Hello, using this method, how could we calculate the texel to pixel ratio? I am trying to implement mipmapping and am having a hard time calculating which texture I should use.

Loved these videos!

The reason a lot of people say that perspective correction with textures needs hardware is because of the per pixel divides necessary. Back in the day that was a disaster for 3D rendering. There were lots of approximations and tricks used back then to make things look better but they were never pixel perfect like the implementation you have here with the per pixel divides.

these videos are amazing

if(MODE==FASTRENDERMODE){
std::ios_base::sync_with_stdio(NULL);
}else if(MODE==RENDER3DMODE){
std::ios_base::sync_with_stdio(false);
}else if(MODE==LOWRENDERMODE){
std::ios_base::sync_with_stdio(true);
} //this should help it worked for my graphics engine may work for your one too

Triangles are disappearing and I checked the clipping, depth buffer and everything in my code (it’s in java) and for the life of me can’t find what’s wrong.

thanks, the ibformation you provided and job you have do are really cool

I think I am done the thing is that peformance of python is terrible with this kind of things so my my 2 FPS were expected

Oh i would love to see a 3D Animation Software tutorial

Sorry I can`t understand what is SampleGlyph, to be more precise I do not know what it does, I am writing in Python using pygame and I managed to accomplish the first part where we simply draw pixels without perspective, but I cannot figure out how to make the perspective, I added w to my vector class, but I cant sample a color by division on text_w, because the value of pixel is our range, so to solve the problem I think I have to figure out how to implement this Glyth sampling

have you considered using allacritty for the console? Also why that for-loop for the depth buffer, why not memset?

This entire set of tutorials is fucking amazing. You are a true gentleman and a scholar. Seriously, I have not seen anything or anyone until now that could give me the insights or knowledge you have in easy to understand, simple and straightforward descriptions of what are doing and what you are coding. I've been looking for tutorials exactly like this because I am learning to use Leadwerks 3D engine, and I wanted to know what was going on under the hood so I could play with different things to learn the capabilities of it, and try to eek out as much performance from it as I could. This has been absolutely brilliant for understanding a multitude of things from rendering, to the difference between rasterising, perspective, and something as simple as understanding what is listed in an OBJ file and what it all means. I tip my hat to you and salute you. Really - thank you so much!

THANK YOU SO MUCH!!!!!

Is it possible to do something like this outside of a console?

Thank you Javid for these awesome tutorials.
Finally I have finished making my own software renderer, starting from drawing pixels to bitmap and drawing lines 1.5 months ago to smooth shaded multithreaded textured 3D models with phong lighting now. Your tutorials are very usefull. Good luck to you Javid : )

I thought I didn't know english enough for listening. It isn't true, the fact is that some people just use so many informal expressions and spell in such piggy way that is almost impossible to understand. Dude, your pronounce is so correct! I can understand clearly every word. Are you british?

Hello javidx9, I started learning from your 3D tutorial series about 1.5yrs ago, i'm implementing the knowledge in web and I understood everything till texturing in less than a month.. However, I've been struggling with how depth buffer works for more than a year and fortunately I understand a little bit after rewatching this tutorial yesternigth but there's a confusion and I would want a clarification

When using depth buffer, a separate array having the same size has the total pixels in the drawing board should be created, and each element in the depth buffer array should be a number indicating the z-value of it's corresponding pixels.

Now the confusion is
How do I determine z-value per pixels if every vertices in a triangle has different z values.

This is the only thing left for me to complete this series after 1.5yrs and I hope I get a response

I love this series but I think its kinda sad that there was no follow up for making it more efficient when there are more polygons than just a few hundred

but wht else!?

Very cool 🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥👍👍🔥🔥🔥

textures are 2d things

This is a very awesome video series. I’m trying to do this in arduino using a very strong and fast controller, and i’ve noticed it’s missing some functions used in the videos. I was able to fix some of them, and i’m still trying to work out other issues, but i can see this coming out to be very good when it’s done. I can’t wait until you make part 5. Thank you for this tutorial series, I wasn’t able to find anything else like this anywhere.

Hi! I'm really enjoying this series, so I was wondering if this is the last episode, because I can´t find part 5 anywhere.

I tried making a general polygon scan line fill rasterizer using edge tables. I decided to do it with the global edge table as an array of linked lists and the Active edge table as a single linked list. I had to adapt all the sorting algorithms to work with linked lists. I never got it to work. Through some debugging, I narrowed it down to the function that created the global edge table. It was giving me mostly garbage. I would like to see the code of someone who succeeded writing a edge table based scanline filler with linked lists in C or C++. If anyone knows of such a piece of code out there, please let me know.

sorry that i am asking before watching the tutorial (i have to save time😬) is the software of this tutorial able to render imported fbx files?

btw, if you assume your position to the triangles will not change radically, then you can maintain a dynamically updated distance buffer, only locally solving depth issues

Thank you so much for your videos!

This whole playlist of fundamentals of 3D engines implementation is pretty good, a lot of math involved in and the complexity isn't that high, besides it uses the most simple and replicable 2d shape a.k.a. triangles to draw everything. Triangles rocks!

Any ideas how can I replace spyro.obj and spyro.spr?