@needle-tools/three-animation-pointer 1.0.1 → 1.0.2
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/README.md +40 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,8 +1,26 @@
|
|
|
1
1
|
# KHR_animation_pointer for three.js
|
|
2
2
|
|
|
3
|
-
This package adds a [three.js](https://github.com/mrdoob/three.js) GLTFLoader plugin for [KHR_animation_pointer](https://github.com/KhronosGroup/glTF/tree/main/extensions/2.0/Khronos/KHR_animation_pointer) support.
|
|
3
|
+
This package adds a [three.js](https://github.com/mrdoob/three.js) GLTFLoader plugin for [KHR_animation_pointer](https://github.com/KhronosGroup/glTF/tree/main/extensions/2.0/Khronos/KHR_animation_pointer) support allowing you to animate anything in your 3D scene, from material, light or camera properties to custom code.
|
|
4
4
|
|
|
5
|
-
###
|
|
5
|
+
### Animate anything
|
|
6
|
+
- all material properties 💎 (including texture transforms)
|
|
7
|
+
- cameras 🎥
|
|
8
|
+
- lights 💡
|
|
9
|
+
- custom code/scripts 📄
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
### Three.js Example
|
|
13
|
+
<a href="https://threejs.org/examples/?q=gltf#webgl_loader_gltf_animation_pointer" target="_blank">
|
|
14
|
+
<img width="1240" height="696" alt="image" src="https://github.com/user-attachments/assets/baa109d8-974b-4c97-9ae9-31a4391e651b" />
|
|
15
|
+
</a>
|
|
16
|
+
|
|
17
|
+
[Video](https://github.com/user-attachments/assets/13fe4102-00ee-430f-9a17-9611fa543f77)
|
|
18
|
+
|
|
19
|
+
[three.js Example](https://threejs.org/examples/?q=gltf#webgl_loader_gltf_animation_pointer)
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
### How to use
|
|
6
24
|
|
|
7
25
|
Install the package:
|
|
8
26
|
`npm i @needle-tools/three-animation-pointer`
|
|
@@ -19,10 +37,30 @@ loader.register(p => {
|
|
|
19
37
|
});
|
|
20
38
|
```
|
|
21
39
|
|
|
40
|
+
*Note: To animate custom code you might need to register your own path resolver in the GLTFAnimationPointerExtension plugin*
|
|
41
|
+
|
|
42
|
+
### How to create glTF files with KHR_animation_pointer animations
|
|
43
|
+
|
|
44
|
+
You can use one of the listed tools below to export glTF animations in the right format
|
|
45
|
+
|
|
46
|
+
- [Blender 4.3](https://www.blender.org/) and newer - *experimental KHR_animation_pointer support, currently only in 'scene animation' mode ([#2285](https://github.com/KhronosGroup/glTF-Blender-IO/issues/2285))*
|
|
47
|
+
- [Needle Engine for Unity](https://engine.needle.tools/docs/unity/) - using KHR_animation_pointer by default in all projects since 2022
|
|
48
|
+
- [UnityGLTF](https://github.com/KhronosGroup/UnityGLTF) - enable KHR_animation_pointer in settings to use in Exports
|
|
49
|
+
|
|
50
|
+
|
|
51
|
+
**Mini Unity Tutorial**
|
|
52
|
+
|
|
53
|
+
[Video](https://github.com/user-attachments/assets/e118a33d-9725-4313-b1d4-b4dbfc7a5a48)
|
|
54
|
+
|
|
55
|
+
*Note: If you use UnityGLTF for exporting the glTF file make sure to enable the `KHR_animation_pointer` option in the UnityGLTF export settings.*
|
|
56
|
+
|
|
57
|
+
|
|
58
|
+
|
|
22
59
|
## Links
|
|
23
60
|
|
|
24
61
|
- [Khronos KHR_animation_pointer spec](https://github.com/KhronosGroup/glTF/tree/main/extensions/2.0/Khronos/KHR_animation_pointer)
|
|
25
62
|
- [three.js repository PR #24108](https://github.com/mrdoob/three.js/pull/24108)
|
|
63
|
+
- [three.js example](https://threejs.org/examples/?q=gltf#webgl_loader_gltf_animation_pointer) - created in Unity
|
|
26
64
|
|
|
27
65
|
|
|
28
66
|
|