I'm trying to build a Timeline component in ThreeJS, similar to this one:
https://visjs.github.io/vis-timeline/examples/timeline/groups/groupsEditable.html
What will be the first steps and do I need ThreeJS or other WebGL libraries for it?
check out this example: https://threejs.org/examples/#css3d_periodictable
I think it comes pretty close to your example:
Related
I'm working on a little project with react-three-fiber. If I load my .gbl 3D Model into the scene it's completly dark even if I use the ambientlight in the canvas. But in the three.js editor it looks exactly like I want it if I use the Modeviewer environment. Is it possbile to download this environmet somewhere and use it in my project?
yes, the stage component from the drei library https://twitter.com/0xca0a/status/1402975317174726656 all you need is wrap your model into <Stage>. as for models being dark even with ambientlight, this is usually related to wrong materials, for instance metalness=1. take a look here: https://discourse.threejs.org/t/ambient-light-and-gltf-models-not-working-results-in-black-model/7428/5
I'm trying to build an example project with custom geometry under Qt 5.15.2 (https://doc-snapshots.qt.io/qt6-dev/qtquick3d-customgeometry-example.html)
I get all qml ui elements drawn except for the mesh. In Qt 6 all works fine and mesh is rendered.
I see on the link attached above that the example refers to Qt 6 however QQuick3DGeometry class which provides us with custom geometry exists in Qt5.
Please let me know if there's a chance to use Qt 5.15 for the purpose of rendering mesh with custom geometry and whether QQuick3DGeometry can be helpful in this case. Thank you in advance.
The solution is to use setName() during initializing custom geometry. That's the way it works in Qt5. In Qt6 it is not necessary. https://bugreports.qt.io/browse/QTBUG-89420
I've been working with an animator to help with my game. The animations all work fine using morph targets, but the file size just gets way too large. Skeletal animations are the answer. We've spent a week working to get the animations exported from blender correctly.
After reading many many articles we were able to get basic animations working correctly. I make sure to set the armature to rest pose and export on the first frame and all that, but the more complicated animations are off.
You can see in this example here (click to cycle animations):
http://www.titansoftime.com/beta/animation2.html
My animator said the problems are related to bone constraints using his controllers. He said his technique is called "Inverse Kinematics".
Anyone have any ideas?
I have found the answer. For one you can not scale the geometry in the json loader (however you can scale the mesh object once created).
The main thing is that my animator was using inverse kinematics, which apparently three.js does not play nice with.
I have fbx model exported from 3ds max. I have 3d coordinate that are extracted from a motion capture session. I want to animate the model using these 3d coordinates. after googling I found xna can be used for this purpose.
I found a tutorial on digitalrun that used kinectxna to capture motion and animate .fbx model using xna. but I can't build it because it wants kinect hardware elements.
I found another tutorial here. I am newbie to xna. I faced difficulties to understand that.can someone point me to right tutorial that expalins skeletal animation of .fbx model using xna?
You can start with this example to understand how animation work:
http://xbox.create.msdn.com/en-us/education/catalog/sample/skinned_model
The animation data is contained in the model itself. But you can change some code to work with your 3d coordinates.
Also...
I found a library to animation. XNAnimation Library
P.S. You can find a lot of tutorials and libraries for animation if you search "Skinned Model"
I am beginner to medium skills, I can create mesh with many polygons, I need to texture map it, those i can handle, but, how to make it Roll Up and UnRoll (I can handle the keyframe animation - but, i just don't know what to do to make the carpet unroll or rollup. Can be carpet or roll of paper towels, just need to know how to do the effect? There are tutorials how to do it with Cinema 4D or Maya - but, i want to do it on the website within the Three.js framework. Any ideas ???
Or is there a way to export the animation data from, say, Blender or Maya?
Thanks
Maybe this one?
http://mrdoob.github.com/three.js/examples/webgl_animation_cloth.html
Let's search for a tutorial on youtube to create the animation in Blender or in Maya
(e.g.: http://www.youtube.com/watch?v=tN_FZiTbaG0)
Create your animation and export your scene into collada (.dae) format
Use the collada loader "webgl_loader_collada_keyframe.html" example file to run your animation. (Replace "pump.dae" with your just exported animation in the example file.)
you could also try using this as3mod port for three.js to manually "roll" a plane. http://nikos-web-development.netai.net/blog/mod3-a-javascript-port-of-as3mod-for-three-js/