@needle-tools/gltf-progressive 1.0.0-alpha.13 → 1.0.0-alpha.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -4,6 +4,14 @@ All notable changes to this package will be documented in this file.
4
4
  The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
5
5
  and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
6
6
 
7
+ ## [1.0.0-alpha.15] - 2023-05-24
8
+ - add: `getRaycastMesh` method
9
+ - add: LODsManager does now expose `targetTriangleDensity`. The target triangle density is the desired max amount of triangles on screen when the mesh is filling the screen.
10
+ - change: create LODsManager via `LODsManager.get(renderer)`
11
+
12
+ ## [1.0.0-alpha.13] - 2023-05-24
13
+ - fix: modelviewer error when trying to access undefined texture extensions
14
+
7
15
  ## [1.0.0-alpha.13] - 2023-05-24
8
16
  - add: vanilla three.js example
9
17
  - fix: texture LODs losing filter setting
package/README.md CHANGED
@@ -2,6 +2,12 @@
2
2
 
3
3
  Support for loading of glTF or GLB files with progressive mesh or texture data for three.js based engines.
4
4
 
5
+ ## Samples
6
+
7
+ - [Vanilla three.js Example](https://engine.needle.tools/demos/gltf-progressive/threejs/)
8
+ - [\<model-viewer\> Example](https://engine.needle.tools/demos/gltf-progressive/modelviewer)
9
+
10
+
5
11
  # Contact ✒️
6
12
  <b>[🌵 needle — tools for creators](https://needle.tools)</b> •
7
13
  [Twitter](https://twitter.com/NeedleTools) •
@@ -11,16 +11,16 @@
11
11
  }
12
12
  </script>
13
13
  <script type="module" src="https://ajax.googleapis.com/ajax/libs/model-viewer/3.4.0/model-viewer.min.js"></script>
14
- <script type="module" src="https://www.unpkg.com/@needle-tools/gltf-progressive@1.0.0-alpha.4"></script>
14
+ <script type="module" src="https://www.unpkg.com/@needle-tools/gltf-progressive@latest"></script>
15
15
  </head>
16
16
 
17
- <model-viewer src="https://engine.needle.tools/demos/lods/assets/ganesha.glb" ar shadow-intensity="1" camera-controls
18
- touch-action="pan-y"></model-viewer>
17
+ <model-viewer src="https://engine.needle.tools/demos/gltf-progressive/assets/church/model.glb" ar shadow-intensity="1"
18
+ camera-controls touch-action="pan-y" auto-rotate max-camera-orbit="auto 90deg auto"></model-viewer>
19
19
 
20
20
  <style>
21
21
  model-viewer {
22
22
  width: 100%;
23
- height: 100vh;
23
+ height: 100%;
24
24
  }
25
25
  </style>
26
26
 
@@ -3,7 +3,7 @@
3
3
 
4
4
  <head>
5
5
  <meta charset="utf-8">
6
- <title>My first three.js app</title>
6
+ <title>Threejs Progressive Loading</title>
7
7
  <style>
8
8
  body {
9
9
  margin: 0;
@@ -20,16 +20,16 @@ window.addEventListener('resize', () => {
20
20
  });
21
21
 
22
22
  const orbit = new OrbitControls(camera, renderer.domElement);
23
- orbit.target = new THREE.Vector3(0, .6, 0);
24
- camera.position.x = -1;
25
- camera.position.y = 1.5;
26
- camera.position.z = 1.8;
23
+ orbit.target = new THREE.Vector3(0, 14, 0);
24
+ camera.position.x = 20;
25
+ camera.position.y = 20.5;
26
+ camera.position.z = 20.8;
27
27
 
28
- const grid = new THREE.GridHelper(10, 10, 0x444444, 0x666666);
28
+ const grid = new THREE.GridHelper(50, 50, 0x444444, 0x666666);
29
29
  scene.add(grid);
30
30
 
31
- const directionalLight = new THREE.DirectionalLight(0xffffff, .2);
32
- directionalLight.position.set(1, 1, 0);
31
+ const directionalLight = new THREE.DirectionalLight(0xffffff, 1);
32
+ directionalLight.position.set(-50, 20, 50);
33
33
  scene.add(directionalLight);
34
34
 
35
35
 
@@ -56,7 +56,7 @@ new EXRLoader().load(environmentTextureUrl, texture => {
56
56
 
57
57
  // Integrate @needle-tools/gltf-progressive
58
58
  // This is the model we want to load
59
- const url = "https://engine.needle.tools/demos/gltf-progressive/threejs/assets/model.glb";
59
+ const url = "https://engine.needle.tools/demos/gltf-progressive/assets/church/model.glb";
60
60
 
61
61
  const gltfLoader = new GLTFLoader();
62
62