Coding Challenge 145: 2D Raycasting

Поділитися
Вставка
  • Опубліковано 25 гру 2024

КОМЕНТАРІ •

  • @discreet_boson
    @discreet_boson 4 роки тому +146

    This man is an international treasure and should be protected at all costs

  • @atrumluminarium
    @atrumluminarium 5 років тому +1113

    Omg this video is so coherent and organised unlike the live stream. Your editor needs a raise Dan hahah

    • @MattRose30000
      @MattRose30000 5 років тому +35

      That's why I always wait for the edited versions, they are just so much nicer to watch.

    • @taba1950
      @taba1950 5 років тому +84

      @@MattRose30000 while true the live stream still have a unique entertaining value

    • @LuisHansenNH
      @LuisHansenNH 4 роки тому +41

      Showing your code VS coding live. That's why I hate coding interviews. It's like they say: the worst part of parallel parking are the witnesses.

    • @vintyprod
      @vintyprod 4 роки тому +10

      @@taba1950 while(true)

    • @MizhiBirb
      @MizhiBirb 4 роки тому +7

      more like a RAYS

  • @MSecYT
    @MSecYT 5 років тому +185

    6:59 "I didn't forget this time"... immediately forgets to add this to the dir.x, and dir.y

  • @rolandferguson1209
    @rolandferguson1209 2 роки тому +2

    I haven't been programming in a while and jumping back in to your tutorials I get to see how much comedy you've added! it's great to see you so expressive

  • @TheFlamingWaldo
    @TheFlamingWaldo 4 роки тому +24

    I program in Python -- I used C++ back when I was in college, but it didn't sit well with me -- and I was inspired by this to try to program some raycasting *in* python, despite my limited experience with trigonometry. I tried my best to construct as many of the math-related functions as I could from scratch, which means I made my own function for finding magnitude, normalizing lines, for projecting lines out at a specific angle, etc etc. I was worried it was going to run awful, but it's actually pretty smooth! It was difficult for me, as I've never taken a trigonometry course and I actually managed to fail remedial math once, but something about wanting to accomplish something makes me learn more. I feel really happy with myself, even if I have what would probably have been easier if I had just used built-in library functions to do my work for me. Your work always inspires me, and this is the third project I've made based off of the suggestions in your videos, so thank you so much!

    • @matiascollado9926
      @matiascollado9926 2 роки тому

      How did you make the ray extend to infinity in one direction?

    • @adammoore4359
      @adammoore4359 Рік тому

      @@matiascollado9926 did you figure this out?

    • @matiascollado9926
      @matiascollado9926 Рік тому

      @@adammoore4359 I did not extend it to infinity, rather I extended it far enough that the user never sees the end of the rays

  • @nehoymenoy3845
    @nehoymenoy3845 5 років тому +31

    It's awesome when a feature can be implemented for both visual and functional purposes.

  • @yourteacher4353
    @yourteacher4353 5 років тому +6

    So basically there are two kinds of people: 1) people and 2) people who brighten your day up. You Daniel is the king of kind 2.

  • @cassioschneider922
    @cassioschneider922 5 років тому +84

    i've never coded anything. don't know why i watched the entire video.
    still, this is AWESOME
    thanks! cheers

    • @TheCodingTrain
      @TheCodingTrain  5 років тому +13

      You can start learning here! ua-cam.com/play/PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA.html

    • @cassioschneider922
      @cassioschneider922 5 років тому +5

      @@TheCodingTrain Thanks for replying! i'll definitely try it out :D

    • @cassioschneider922
      @cassioschneider922 5 років тому +39

      @@nerasure actually I watched the entire playlist with the starting tutorials! I made some really cool stuff, made 3d pong, moon phases shown in 3d, a few simple games and other simple stuff just to try out p5js and learn a little
      I would definitely recommend it, Daniel is an awesome teacher, always so positive and ready to a swerve questions!

    • @kenan2386
      @kenan2386 3 роки тому +2

      :)

    • @aleksszukovskis2074
      @aleksszukovskis2074 5 місяців тому +1

      sleep watching?

  • @justiceforsethrichwwg1wga160
    @justiceforsethrichwwg1wga160 5 років тому +52

    I’ve been watching your channel for awhile now....you’ve gotten way better at your presenting! Really great content! Easily one of my favorite channels.

  • @wlockuz4467
    @wlockuz4467 Рік тому +1

    This video is simply amazing! I always used to think of Raycasting as this very complicated topic which requires a good understanding of Math but at not point did it feel like I didn't understand this video. I am blown away!

  • @CYXNIGHT
    @CYXNIGHT 5 років тому +6

    I used to code on Gamemaker, and was transitioning to Unity, but I came across your channel and Java is now my favourite language. I was getting discouraged from coding as Gamemaker couldn't do what I wanted, but since your channel popped up in my recommended I have sinced been coding almost every day as I never cease to find something to code, I can't thank you enough.
    I love your channel and your vibrance, I hope you never stop these videos, and live-streams!

    • @33KK
      @33KK 5 років тому

      He uses JavaScript

    • @TheCodingTrain
      @TheCodingTrain  5 років тому +1

      Thanks for this nice feedback!

  • @dkkoala1
    @dkkoala1 5 років тому +135

    The ray.cast method is already calculating the relative distance to each intersecting object in the form of "u", so an optimization would be to use it instead of the p5.vector.dist function. This is more efficient because p5.vector.dist uses euclidean distance, and therefore calculates square roots each time it is called, which is a heavy calculation.
    But great video as always!

    • @TheCodingTrain
      @TheCodingTrain  5 років тому +22

      Thanks for the feedback!

    • @dkkoala1
      @dkkoala1 5 років тому +15

      ​@@TheCodingTrain No problem, i always love your videos because they remind me that coding can still be beautiful. Im a machine learning master student, so your project with the self driving car interests me very much, even though i am more of a supervised learning guy. Please feel free to contact me if you need some resources for how to approach the subject. In any case you should definitely check out Arthur Juliani's Medium article about Q-learning, it is a very good resource to reinforcement learning.

    • @likeyou3317
      @likeyou3317 5 років тому +2

      So smaller "u" means dist is smaller?

    • @TheCodingTrain
      @TheCodingTrain  5 років тому +11

      @@dkkoala1 Indeed, such a great reference!

    • @dkkoala1
      @dkkoala1 5 років тому +5

      @@TheCodingTrain Another thing that could maybe speed up your training is the concept of curriculum learning. It is done by starting out training with the simplest version of your problem and then as the AI gets better raise the difficulty of your training. An example could be starting with training the AI to drive in a straight line, and when it can do that then add a bend to the track. Multiple objective functions could also be useful, first prioritizing getting to the end of the by having the distance to the goal as your loss, and afterwards using the speed at which the AI can get there instead. In this way you first ensure a basic understanding of the task and then you can optimize it make the model better and faster at the task. Unity has a great blog for curriculum learning blogs.unity3d.com/2017/12/08/introducing-ml-agents-v0-2-curriculum-learning-new-environments-and-more/

  • @sushicook816
    @sushicook816 4 роки тому

    This channel is a gold mine for researchers.

  • @DenerWitt
    @DenerWitt 5 років тому +6

    I like the light like effect at the end. when math and programming become art. Pretty.

  • @nkheart4
    @nkheart4 6 місяців тому

    My first goal is to learn what you teach, but I also enjoy seeing your reactions when you start coding. I see myself in you, so I love your channel because I feel the same joy you get when coding graphics like this.

  • @DodaGarcia
    @DodaGarcia 2 роки тому

    That ending made me SO happy I can't even describe it

  • @7cle
    @7cle 5 років тому +2

    Keeping this that simple, given the complexity of the subject is the mark of a rare gift Dan : intelligence! Thank you for sharing it with us. It is a pity so many are not fussed to share stupidity on social media though.

  • @thebrickccentric3728
    @thebrickccentric3728 8 місяців тому

    2 cases that the line segment intersection check here forgets to consider (which become more apparent in the next video):
    -If the ray is parallel with the wall, but also directly in line with it, the intersection check here will return empty when it should return the closer of the 2 endpoints of the wall (and the distance to it)
    -If the particle/vehicle is sitting directly on a wall (or if a wall has the same start and endpoint / 0 length), then the intersection check should return the ray's origin point (0 distance) no matter what
    Great video though; this stuff is super useful

  • @HellTriX
    @HellTriX 5 років тому +10

    The end result to this one was absolutely beautiful. I think its my favorite one yet. I also cannot wait to see some NNs applied to this!

  • @jcoco44
    @jcoco44 4 роки тому

    This is the first time I've watched your videos, and frankly, I'm a bit disturbed by how excited you are.
    It's contagious...

  • @squirrel1620
    @squirrel1620 5 років тому +6

    When I was coding with unreal 2 and 3 engine, the Trace and FastTrace were used for ray tracing. It worked more or less the same, mathematics wise anyways. They pull more tricks to avoid multiplication or division because it saves time.

  • @soejrd24978
    @soejrd24978 5 років тому +2

    That plan on this project is insane!! I"m so hyped!!

  • @izangomez6806
    @izangomez6806 5 років тому +193

    3:25 Code bullet will help you, sure

  • @julianirmer5854
    @julianirmer5854 5 років тому +7

    The only channel for which I activated notifications.

  • @batonator
    @batonator 5 років тому +18

    i love your enthusiasm, you make me wanna code more. I can't wait to get a PC

  • @NinjarioPicmin
    @NinjarioPicmin 5 років тому +2

    Yay for Nicky Case. I love a lot of their work

  • @ivankorytko1964
    @ivankorytko1964 5 років тому

    The best explanation of the work. Interesting, understandable, not boring and I was impressed that it is easy. I do not know JS, but the idea and logic is quit simple. Thanks for your videos.

  • @cidie1
    @cidie1 2 роки тому

    Thanks so much, I'm half watching for the subject and half watching because you are just so fun!

  • @proxy1035
    @proxy1035 5 років тому +53

    2:34 when your parents ask you to do anything

  • @ValleyOfWillows
    @ValleyOfWillows 3 роки тому +19

    Making the boundaries into letters with the same color as the background and then having the lightsource just randomly go around the canvas would probably make a cool screensaver.

    • @zelioz848
      @zelioz848 Рік тому +2

      Yo that is sick, i'm gonna learn how to change my desktop background to something like that and program it myself

  • @thegoodhen
    @thegoodhen 5 років тому +9

    This really reminds me of SLAM (simultaneous localization and mapping) visualizations in robotics. You have a robot with a LIDAR scanner and it sees the environment in exactly this way, as it casts multiple laser rays.

  • @catherinebernard3282
    @catherinebernard3282 4 роки тому +1

    Thanks to this I managed to get a version of this working in gamemaker (studio 2). Was a lot of fun.

  • @MagnaKay
    @MagnaKay 4 роки тому

    The enthusiasm is so contagious ahah. Good job!

  • @krccmsitp2884
    @krccmsitp2884 2 роки тому

    I really like your step-by-step explanations and approach to solving problems. What looked too complicated at first becomes gradually more comprehensible, and finally you think to yourself, "what, it's that simple?".

  • @bluepixelmusic9463
    @bluepixelmusic9463 5 років тому +2

    finally a channel that doesnt expect me to be a master brain

  • @Apoorvpandey
    @Apoorvpandey 5 років тому +91

    Coding train : "
    Making world a better place to live in "🌼🌼🌼

  • @husseinshukre3828
    @husseinshukre3828 3 роки тому +1

    Great video helped me build openGl program that recolor the selected polygon

  • @My-video123
    @My-video123 3 роки тому +1

    At first I thought you are very strange guy. After several your videos I just realized it’s a gold material to be taught and implemented. Thank you mate

  • @andrewweller5119
    @andrewweller5119 Рік тому

    Great, thanks fo rthis. i re wrote it all to work in Game Maker Studio and have learned soo much.

  • @HoneyDustTheReal
    @HoneyDustTheReal 3 роки тому +6

    i'm just putting my idea here but i think it would be really cool and entertaining to combine the maze generator algorithm with the a* pathfinding algorithm to solve it and finally this one that could be implemented by redirecting the "light source" to the mouse cursor and be able to explore the maze (which would be all dark at first) and just seeing the light making it's way to the edges of the paths as we move along them, like some sort of dark exploration game

    • @Mabeloid
      @Mabeloid 2 роки тому +1

      sounds like 2d scanner sombre

  • @run4thewin357
    @run4thewin357 4 роки тому

    This is the most interesting video i saw this year

  • @garychap8384
    @garychap8384 4 роки тому

    More efficiently, when trying to identify the whole area "visible" from a point ...
    For all obstacle endpoints, take their angle. Sorting the endpoints by these angles gives you a clockwise (or anticlockwise) list of points. Now it's easy to evaluate each point in turn, working around the circle to construct a convex region of points. You can then gradient fill that region, or use the region to apply dynamic lighting/shadows.
    You can even do some fairly complex stuff with this region/origin ... particularly if your 2D tiles have an extra map for a simplified 'normal' and 'height'. The height lets you suspend lighting (for some distance) along the ray, giving you tiles that cast shadows onto tiles, to cast composite shadows on floors. Orientation and Slope values per pixel let you modulate how a dynamic light affects the base texture.
    But, at its very simplest, you can just use a very weak alpha with a circular gradient to give a very subtle effect which, although it's not accurate, is subtle enough that people don't notice.
    You can have lots of fun with these regions.

  • @elbowrustler
    @elbowrustler 5 років тому +4

    Your enthusiasm got me excited as well. I'm sure it was worth a sub (:

  • @elendil4543
    @elendil4543 2 роки тому

    This guy can make whole game engine with processing

  • @abazur7742
    @abazur7742 5 років тому

    now after this video i can tell that you are a genius

  • @Edd4324
    @Edd4324 Рік тому

    I love your sticker on your laptop says never forget the this dot and you forgot it in the first part of the code! Great Video as usual!

  • @mr.budders8740
    @mr.budders8740 3 роки тому

    My man, I want to give you the highest honor I can bestow for teaching me in 20 minutes (only the first portion of video) how to detect ray intersection when everywere else says that you gotta to a bunch of tan() cos() and sin() functions with some more advanced trigonometry within and hour. A subscribe
    BTW I litterally spent 4+ hours trying the other method and it never worked

    • @homelikebrick42
      @homelikebrick42 3 роки тому

      BTW that is actually what p5 is doing for you inside p5.Vector

  • @Couchwurst
    @Couchwurst 4 роки тому

    Thank you for this awesome Coding Challenge! And for bringing up the reference to Nicky Case - his game and ideas are fantastic!

  • @MemoryPrimeMinister
    @MemoryPrimeMinister 4 роки тому

    Coding a line would send me off the wall. Then here you are making ray casts

  • @sonik382
    @sonik382 5 років тому +1

    I am trying to code the AI car as well...awesome you suggested that! Can't wait for the next challenge! Greetings from Italy!

  • @medhavimonish41
    @medhavimonish41 4 роки тому

    wow , you never fail to amaze

  • @scatheroy
    @scatheroy 4 роки тому

    Just awesome. Great video. Thanks, man.

  • @therealstillie
    @therealstillie 5 років тому

    That was unbelievably enjoyable to watch!!!! Thank you

  • @ai_zj
    @ai_zj 5 років тому +9

    And Dan said, "Let there be light," and there was light.

  • @FazpyDev
    @FazpyDev 2 роки тому

    This video is so useful, I'll for sure have a look at it!

  • @RedMasterJV
    @RedMasterJV 7 місяців тому

    LMAO that "this dot" tune is great

  • @OrangeC7
    @OrangeC7 5 років тому +30

    Wow! I've seen and been to basically everything he referenced at the start of the video. Does this mean I'm finally good at the internet!?

  • @alexmattheis
    @alexmattheis 4 роки тому

    Very good explanation and coding.

  • @silvertakana3932
    @silvertakana3932 3 роки тому

    15:08
    Him: Now, it’s time for me to get YOU!
    Me: *running out of my room*

  • @Csc5csc5
    @Csc5csc5 5 років тому +18

    Bruh, that's a lot of energy before noon. Coffee or Red Bull?

  • @massimogiardina9138
    @massimogiardina9138 5 років тому +1

    You helped me so much with this.
    How could I ever thank you?

  • @8bit_pineapple
    @8bit_pineapple 4 роки тому +13

    ♫When A Grid's
    Misaligned With
    Another Behind
    That's a Moiré♫

    • @masonhunter2748
      @masonhunter2748 4 роки тому

      You stole it

    • @8bit_pineapple
      @8bit_pineapple 4 роки тому

      @@masonhunter2748 Yea. Credits to xkcd comics, that everyone here should read ;)

    • @masonhunter2748
      @masonhunter2748 4 роки тому

      8bitpineapple what’s the number

    • @-Burb
      @-Burb 4 роки тому

      @@masonhunter2748 1814

  • @mihaisolomon2893
    @mihaisolomon2893 5 років тому +9

    I did something like this 1 month ago, but my code wasn't so explicit, thank you for the explanation

  • @imvickykumar999
    @imvickykumar999 5 років тому +1

    You are my inspiration 🤘🤘

  • @itoverview-awesomeandroida1492
    @itoverview-awesomeandroida1492 4 роки тому

    Congrats on 1 million! :)

  • @brianbrooks4448
    @brianbrooks4448 5 місяців тому +1

    Very interesting subject matter. Love the quirky presentation style. Sub added. I'm interested in using this type of algorithm, but converted to an electronic system using ultrasonic emitters and sensors. This video was good inspiration though, so thanks for that.

  • @arsnakehert
    @arsnakehert 3 роки тому

    "This comes from 15 years of programming in Java"
    Oh, I can see the Vietnam flashbacks in his eyes

  • @Jeff-Vader_head_of_catering
    @Jeff-Vader_head_of_catering 5 років тому

    Very cool! My brain melted about 1/4 of the way into the video, but, cool.

  • @MrNosugarcoating
    @MrNosugarcoating 5 років тому

    Wow that looks so cool

  • @SomeOrangeCat
    @SomeOrangeCat 3 роки тому

    If my computer sciences professor used a train whistle, I would never have dropped out of college.

  • @WilliamLDeRieuxIV
    @WilliamLDeRieuxIV 4 роки тому

    5:36 I have always heard people complain about the use of this.member versus just referencing the member directly (saying that using "this" to qualify an in-class member is redundant).
    In short, It depends on the language -- probably just better to always use "this" and be done with it....

  • @dalegriffiths3628
    @dalegriffiths3628 4 роки тому

    Fantastic - can't wait for the self driving vehicle you mentioned you'd like to do with this!

  • @wumbl3
    @wumbl3 4 роки тому +17

    24:23 first sighting of the covid-19 virus. May 8th 2019.

  • @shaileshrana7165
    @shaileshrana7165 4 роки тому +4

    Light also diffuses around edges. Maybe that can be added.

  • @Damian_Stefann
    @Damian_Stefann 5 років тому +1

    Dude i am making videogame and i needed this! Thanks :)

  • @xiija
    @xiija 5 років тому +1

    Dan the Man is the BOSS! ♥

  • @AlejandroCastilloRapper
    @AlejandroCastilloRapper 3 роки тому

    AMAZING. BOOKMARKED

  • @KDSBestGameDev
    @KDSBestGameDev 2 роки тому

    t basically is where on the line is the hit. 0 means it is on point a, 1 means it is on point b. Higher than 1 means beyond point b and lower than 0 before point a. That also means t > 0 should be t >= 0 and t < 1 should be t

  • @avi12
    @avi12 5 років тому

    Dan, from Chrome 74, when initializing values in a certain class - you no longer need the constructor. Just initialize them
    Unless, of course, your constructor receives parameters

  • @jibxjib
    @jibxjib 4 роки тому

    I love code man

  • @jonmichaelgalindo
    @jonmichaelgalindo 4 роки тому

    I just tried doing this last week, and I also arbitrarily picked cast(). :-)
    Although I first intersected the ray with a polygon's bounding-box (polygons had translation/rotation/scale), then transformed the ray into the polygon's local space, then calculated the intersect depth (if any), then transformed that depth back out to the ray's space. That way I didn't have to convert all the polygons' vertices to global space, since I only need the ray's collision point for drawing.

    • @jonmichaelgalindo
      @jonmichaelgalindo 4 роки тому

      Also, it looks like you're using p5 for vector stuff, but I was just using JS.

  • @jojolafrite90
    @jojolafrite90 4 роки тому

    I think what we call rasterization is a natural evolution of raycasting. You do cast rays to determine if a triangle is on a pixel, or an edge of triangle or a point.

    • @eddieh7962
      @eddieh7962 4 роки тому

      Or is the evolution the other way around, from rasterization to ray tracing

  • @alfcnz
    @alfcnz 3 роки тому

    Impressive! 🤯🤯🤯

  • @AB-hr4qg
    @AB-hr4qg 4 роки тому +2

    Programmers: I can create nearly anything! I have incredible power! Except that one thing... *glances fearfully at "this."* ...It scares me...

  • @anotherdimension97
    @anotherdimension97 5 років тому

    Grandioso, saludos desde Perú.

  • @Bunnybobscodes
    @Bunnybobscodes Рік тому

    Great video!

  • @frankie_goestohollywood
    @frankie_goestohollywood 3 роки тому

    Brilliant video!!!! Thank you :-)

  • @WzzupDaAwsome
    @WzzupDaAwsome 5 років тому +3

    What if you made the light that hits the walls reflect back at whatever angle it hit the wall? I've seen videos of rooms where there is a single point where light can't reflect to, it would be cool to test that out with this program.

  • @artistpw
    @artistpw 3 роки тому

    This would make a great night light on a screen.

  •  5 років тому +1

    I've been a subscriber for a while but I'm not used to watch a full video.
    That one caught me and I was able to follow easily your train of thought even tho I don't know those libraries.
    Amazing work. Programming should be exciting as you are showing!

  • @itay1213141
    @itay1213141 5 років тому +1

    Great video, i love these so much 😁

  • @omaislindodesantos
    @omaislindodesantos Рік тому

    great video really thank for doing it.

  • @experimentators8699
    @experimentators8699 5 років тому +3

    the true programmer would be watching this 20 minutes after upload

  • @chrismiles3838
    @chrismiles3838 4 роки тому

    26:07 why do we not have to update the pos attribute of all the rays ? why does updating this.pos of the particle class also update the positions of all the ray instances in the list that particle has?

  • @connorconnor2421
    @connorconnor2421 4 роки тому +1

    Trippy thumbnail

  • @ratdn
    @ratdn 4 роки тому +1

    damn you did all this in less than an hour and it took me like 20 hours to recreate this in python using tkinter

  • @nicolasmarques7460
    @nicolasmarques7460 4 роки тому

    Amazing thanks for share this content!

  • @philtoa334
    @philtoa334 4 роки тому

    beautiful .

  • @RhoTrepaan
    @RhoTrepaan 5 років тому

    it looks very pretty! :D
    (and very informative, too)

  • @ViciousVinnyD
    @ViciousVinnyD 8 місяців тому

    Every time this thumbnail shows up in my recommended it does this thing where it moves as I scroll