Three.js in practice - Procedural Map - tutorial for beginners 2022 - part 1

แชร์
ฝัง
  • เผยแพร่เมื่อ 16 พ.ย. 2024

ความคิดเห็น • 38

  • @lucasprins8895
    @lucasprins8895 ปีที่แล้ว +3

    Im a bit late to the party but thank you so much for making these tutorials, theyre incredibly helpful!

    • @irradiance730
      @irradiance730  ปีที่แล้ว +1

      Thanks :) I'm glad you're finding these helpful

  • @Saghi325
    @Saghi325 2 ปีที่แล้ว +3

    subscribed, awesome tutorial man, keep it up!

  • @antoniofuller2331
    @antoniofuller2331 2 ปีที่แล้ว

    Finally, someone who doesn't abstract away things

  • @amandla1020
    @amandla1020 2 ปีที่แล้ว

    wow bro, i just discover your channel, its amazing
    thanks

  • @alebuda117
    @alebuda117 2 ปีที่แล้ว

    thanks for your videos!

  • @jcruz6888
    @jcruz6888 2 ปีที่แล้ว

    I gave you a like just for that fabulous introduction of your fame.

    • @irradiance730
      @irradiance730  2 ปีที่แล้ว

      Ahahah thank you! It was an important milestone 😂

  • @exe-h8x
    @exe-h8x 2 ปีที่แล้ว

    It will be great to have this tutorial for react-three-fiber

    • @exe-h8x
      @exe-h8x 2 ปีที่แล้ว

      Really nice tut by the way

    • @irradiance730
      @irradiance730  2 ปีที่แล้ว

      thank you :) this one probably should have been made in R3F from the very beginning, but I didn't know how to use the library back then, I'm just getting started

  • @JustZ4NC0
    @JustZ4NC0 2 ปีที่แล้ว

    thanks for the tutorial

  • @ThrillDaWill
    @ThrillDaWill 2 ปีที่แล้ว

    how do you create that async function with the renderer, I also saw in some of your other videos making it but I still don't understand it.

    • @irradiance730
      @irradiance730  2 ปีที่แล้ว

      you mean the one at 1:36? is there something specific about it that isn't clear?

    • @ThrillDaWill
      @ThrillDaWill 2 ปีที่แล้ว

      @@irradiance730 I’m just not sure how you were able to get it.

    • @irradiance730
      @irradiance730  2 ปีที่แล้ว

      Your version of threejs doesn't support setAnimationLoop() ? Is that the function you're not sure how to get?
      Or is it that you can't use the async keyword? Even if that would be strange if you have a modern browser

    • @ThrillDaWill
      @ThrillDaWill 2 ปีที่แล้ว

      @@irradiance730 I can’t get the async function, I found a work around tho for my project at least. I appreciate the help!

  • @sushiwaumai4773
    @sushiwaumai4773 2 ปีที่แล้ว +4

    Great content! But probably a dark-themed editor would be more appealing to the audience.

    • @irradiance730
      @irradiance730  2 ปีที่แล้ว +1

      This is the second time that I'm hearing this and you guys convinced me to switch theme for my next video, thanks for the feedback!

  • @conceptwcom
    @conceptwcom 2 ปีที่แล้ว

    You think it would be complicated to build the map of hexagons concentrically. From the middle to the outside?

    • @irradiance730
      @irradiance730  2 ปีที่แล้ว +1

      I'm confident that there is a way of building the map concentrically, you'd have to replace the grid-like for loops into something that starts at 0,0 and then expands outwards with a radius/theta type of loop

    • @conceptwcom
      @conceptwcom 2 ปีที่แล้ว

      @@irradiance730 Can you do it?

  • @trevorfranks69
    @trevorfranks69 ปีที่แล้ว

    How do you use skypack? I'm quite new at this. Also i noticed that when you type anything like "Mesh" it automatically adds on the import at the top. How did you do that?

    • @trevorfranks69
      @trevorfranks69 ปีที่แล้ว

      btw i already downloaded the three.js library on my PC so i put it together on the project folder. all i have to do i still have to add THREE in front of the functions unlike what you did.

    • @irradiance730
      @irradiance730  ปีที่แล้ว +1

      hey there! I moved away from skypack a long time ago and I'm still trying to find a better alternative for my videos, if you can follow the project by typing THREE in front of the functions everything should work as normal :) also about the imports automatically being added, that's either vscode intellisense or just me copy / pasting it and not showing it on camera :)

  • @devcode619
    @devcode619 2 ปีที่แล้ว

    subscribed ! Great content.
    Unfortunately i got an error message ( THREE.RGBELoader Bad File Format: bad initial token ) at the point 3:42.
    I already spend a few hours to fix the issue but without success. Do you have any idea ??
    Thanks in advance !

    • @irradiance730
      @irradiance730  2 ปีที่แล้ว +1

      Can you make a jsfiddle or a gist on github such that I can see your code?

    • @devcode619
      @devcode619 2 ปีที่แล้ว

      @@irradiance730 sure ! but i cannot share the link here. I already contacted you via mail.
      Thanks again :)

  • @GuiDduck
    @GuiDduck ปีที่แล้ว

    you should make a course on udemy or something

    • @irradiance730
      @irradiance730  ปีที่แล้ว

      Maybe one day :) for now I'm happy to share it for free with the community, since it helped me so much on my own journey

  • @angelo-u
    @angelo-u ปีที่แล้ว

    dark mode please :(

    • @irradiance730
      @irradiance730  ปีที่แล้ว

      I know, I'm sorry! all the videos published after this one are on dark mode, and all my future ones will be as well :)

  • @scottonanski4173
    @scottonanski4173 2 ปีที่แล้ว

    You should do a basic setup video, showing how to understand the ThreeJS documentation because it sucks. Also, take more time explaining why your code works. People who are coming to learn ThreeJs most likely don't have a strong grasp of how JavaScript works. If they did, they wouldn't be watching TH-cam videos. They would understand the garbage documentation of ThreeJs.

    • @irradiance730
      @irradiance730  2 ปีที่แล้ว +1

      Thank you for your feedback! I've never thought about cross-referencing the threejs docs and that's a great idea, I'll try to do that in the future
      Is there a specific point in the video where you felt like a concept wasn't clear? that would definitely help me improve my future videos! :)

    • @scottonanski4173
      @scottonanski4173 2 ปีที่แล้ว

      @@irradiance730 ​ It's not so much that it's not clear. It's that your use of the new operator is beyond the basic understanding of beginners. I don't think they're too up to speed on classes, and class constructors. But, then again how do we define a beginner? Somewhat of a nebulous term I think.
      All in all, the video is fine, I just think if someone who just wants to import their little gltf into a scene, and put some lights on it might be a little confused as to why you're writing your code in the way that you are. If they were to look at the documentation for ThreeJs to try to get their head around why you're building things in this way, it would confuse them even more because the ThreeJs documentation is purposefully obfuscated; they adamantly believe the user should have a specific knowledge base if they want to use ThreeJS, and don't bother to accommodate new learners.