6
$\begingroup$

I have a mountain range scene very similar to this:

displacement anim

The mesh is a simple plane extruded to form a low poly mountain range, the animation uses 3 shape keys, a base and 2 for random vertices displacement. This is then keyframed 7 times over 250 frames to make the surface look like it's continually subtly shifting.

My intent is to use the Three.js output to embed the 3D animation into a web browser. However, it seems the only examples I can find use "skinning" and "bones".

Is it possible to do without bones or is there an alternative that isn't embedding as a video?

$\endgroup$
3
  • $\begingroup$ Blender has an addon to export to MDD - can three.js read that? $\endgroup$
    – sambler
    Commented Mar 31, 2016 at 3:48
  • $\begingroup$ I can export straight to three.js. I've also tried uploading my .blend file straight onto clara.io but the materials and animations don't seem to load with it and there is no animation. I have also noticed once loaded into webGL the model is smoothed and shiny when its supposed to look more like an origami mountain range $\endgroup$
    – devchimp
    Commented Mar 31, 2016 at 7:53
  • $\begingroup$ But can three.js read an mdd file - it is designed for animated mesh data. $\endgroup$
    – sambler
    Commented Mar 31, 2016 at 14:45

1 Answer 1

0
$\begingroup$

Not sure if this is what you need, but it's a plugin for blender to export json for threejs.

https://github.com/mrdoob/three.js/tree/master/utils/exporters/blender

It has the instructions on how to install it.

To animate my stuff I use shapekeys. Try this tutorial :

https://www.youtube.com/watch?v=JKB4aPUkCJw

Hope that was helpful

$\endgroup$
3
  • $\begingroup$ Will you please add the important steps for the tutorial here. Link only answers are highly discouraged, if the link changes then the answer becomes useless. $\endgroup$
    – David
    Commented May 9, 2016 at 3:39
  • $\begingroup$ I have already tried this, unfortunately the moment i add a bone and parent it to the mesh three.js refuses to export saying that the bones arent valid $\endgroup$
    – devchimp
    Commented May 10, 2016 at 8:57
  • 1
    $\begingroup$ Recently the threejs Blender JSON exporter has been removed. I would suggest using the glTF Blender exporter (github.com/KhronosGroup/glTF-Blender-IO) instead, which supports shape keys and can be imported to three.js as well. $\endgroup$ Commented Nov 18, 2018 at 7:15

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .