How To Export Three.js Scene into GLB Format from scratch | GLTFExporter

Поделиться
HTML-код
  • Опубликовано: 5 сен 2024
  • НаукаНаука

Комментарии • 20

  • @knightcube
    @knightcube  3 года назад +1

    Important Timestamps
    00:00 - 00:44 - Video Overview
    00:44 - 00:50 - Trailer
    00:50 - 07:45 - How to set up a basic Three.js project?
    07:45 - 11:25 - Adding visual polish to the Three.js scene
    11:25 - 18:14 - How to use GLTFExporter to export the scene into GLB format and download it?
    18:14 - 22:00 - Code Explanation
    22:00 - Adding minor adjustments to the project
    22:21 - How to add OrbitController?
    24:24 - Thanks for watching
    💡 I recommend you to use GLB format over GLTF format because a single GLB file contains all the textures and animation data in binary format. However, GLTF files contain a reference to external files i.e textures and animation. As an end-user, it is much easier to deal with GLB rather than GLTF because we don't have to make any changes to the model when it is stored or sent from one device to another. You may wanna use GLTF over GLB when you want to edit and make changes to the model in a 3D animation tool such as Maya, Blender, or Cinema4D because the external files such as textures and animations are available separately. It becomes much easier to create custom textures or animations when you use GLTF over GLB, but for sending and displaying 3D content I suggest you go for GLB over GLTF.
    🙏I would highly appreciate it if you could donate some amount here for this channel's long term sustainability - www.buymeacoffee.com/knightcube
    More Three.js videos👇
    ✅ How to deploy a Three.js project on GitHub? (Not using Webpack) - ruclips.net/video/gpTjJk-pt6s/видео.html
    ✅ How to Load a 3D model in Three.js | GLTF/GLB Model | GLTFLoader - ruclips.net/video/yPA2z7fl4J8/видео.html
    ✅ How to download lightweight 3D models for Three.js? - ruclips.net/video/KDz7CwmNsIA/видео.html
    🎥 Three.js playlist - ruclips.net/video/UBPXLwRT-Io/видео.html

  • @daria.746
    @daria.746 Год назад +1

    Wow man! One of the first tutorials where I just typed the exact same thing and it actually worked. Your explanation really helps!!

  • @fasiulhaq2366
    @fasiulhaq2366 4 месяца назад

    The way you explained is amazing, Very helpfull

  • @shuvamandal4736
    @shuvamandal4736 3 года назад

    Keep doing thee.js videos like this.. currently i am learning three.js and want more this type of tutorial or project from you..thank you❤️

    • @knightcube
      @knightcube  3 года назад +1

      Thanks for watching :)

  • @muhammadbilalmalik7292
    @muhammadbilalmalik7292 4 месяца назад +2

    Hi, custom shader materials are not exported please tell if there is any solution for this?

  • @szz0108
    @szz0108 3 года назад +1

    Sir, I appreciate your work , and this video helps me a lot in learning Three.JS

  • @MiguelMesaP
    @MiguelMesaP 2 года назад

    Thank you Rajat! I would like to know how to save this .GLB file in the backend server? to load afterwards...

  • @bralri
    @bralri 2 года назад

    excellent video, thanks for the help! 😃

  • @avatr7109
    @avatr7109 2 года назад

    Completely new to this ..but Can we use a 3D software like Blender , etc.. to upload our Models into threejs?? and build a website like that?
    (eg: A house or a Complete forest made in blender and i want that Scene as a website)

  • @PauRosello-oz3oi
    @PauRosello-oz3oi 3 года назад

    Thank you for this video! I would like to export animations, but something is not working. Is there an example somewhere?

  • @echosquest
    @echosquest 3 года назад

    Awesome work, is there a way to directly have three.js take that 3-D object and say add layers to it or change the colors inside the glb?

  • @Rngproduct
    @Rngproduct 6 месяцев назад

    Hi , how to export stl files from html ,can you send the code

  • @muhammadhussnainshabbir6370
    @muhammadhussnainshabbir6370 2 года назад

    Hello Sir, I am using the same code in React.JS for export 3d Model Scene in GLB but it shows me an error in console
    'index.js:1821 Uncaught TypeError: Right-hand side of 'instanceof' is not an object'

  • @alexanderricardez3060
    @alexanderricardez3060 2 года назад

    I get this error: Uncaught SyntaxError: Cannot use import statement outside a module

  • @paramjotsingh6521
    @paramjotsingh6521 3 года назад

    Please tell how to host a three js site with webpack ;)

  • @ubilrodriguezarrascue
    @ubilrodriguezarrascue 3 года назад

    How does it take a format from FBX to three js ?, please some answer