[ Web Proxy ]
URL:
Viewing: https://raw.githubusercontent.com/iu5git/JavaScript/main/tutorials/threejs/README.md [Back]  [Original]

#   3D Gallery (GLB)

 -   3D- ( GLB)     ,     .

---

##    

*       (4  )  3D-  ( Three.js + GLTFLoader).
*   ,      `.glb`    (   IndexedDB ,   ).
*        .
*           , ,       .
*      single frame,   -   .
*    (,  + )         .

---

##   

```
project-root/
 index.html           //   ()
 detail.html          //    
 app.js               //    (!)
 detail.js            //    
 idb.js               //   IndexedDB (user-)
 styles.css           // 
 models/              //   glb  (car.glb, tree.glb  ..)
      car.glb
      tree.glb
      tree1.glb
      tree2.glb
 ...
```

---

##    

1. ** **    `.glb`    `models/`.
2.      (,  [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer)  VS Code  `python3 -m http.server`).
3.   [http://localhost:5500/](http://localhost:5500/) (    ).

---

##  

* **Three.js** (  importmap)
* **GLTFLoader**   glb
* **IndexedDB** ( idb.js)    
*   CSS,  

---

##   

* ** :**
        3D-.
* ** :**
     `.glb` (   ).
* ** :**

  *    (OrbitControls)
  *  +    
  *    /  /  /     
* ** :**
     ,       .
* **  :**
          (,  + ).

---

##  

* **  Three.js   importmap  head index.html  detail.html**:

  ```html
  
  ```
*   js-   `type="module"`.
* ** .glb     models/**,     (   ).
* **      ,      index.html.**

---

##     ?

1.        `.glb` .
2.              (IndexedDB).
3.      .

---

##      

* **      ?**
      ,      mesh /  bounding box     .

* **      ?**
  ,  `.glb`     `/models/`   .

* **   ?**
   [PolyPizza (GLB Only)](https://poly.pizza/search/tree?format=glb).

---

Web Proxy Viewer  |  New URL  |  Original Page