Three.js可以加载json类型的模型文件与动画,Three.js提供的方案的是用Blender建模软件来导出json给Three.js加载。这里我尝试了加载json类型的文件,这里我参考了demo里的效果制作。结果也是正确的。但是在用自己模型在Blender导出json文件使用时就出现问题了,动画死活加载不出来。
具体分析问题后,觉得可能是资源的导出有问题,对比自己导出的json与demo给出的json,找到问题所在。看下图
刷新动画数据
看最后的效果:
微信小程序使用ThreeJs需要使用官方库 threejs-miniprogram ,API和原生ThreeJS基本一样,很好上手。喜欢数字孪生或者游戏的朋友,强烈推荐学习ThreeJs。该库入门简单,官方有很多优秀的demo可供参考,文档(包含中英文)也比较详细。有计划用ThreeJS做一个动物世界,模拟原始森林里各种各样的有趣的可爱的动物,包括它们声音和故事。有兴趣的或想加入这个计划的朋友可以在下面留言。
添加canvash画布,设置宽度100%,高度设置为屏幕高度减去状态栏高度和导航栏高度。
导入threejs,并创建threejs变量传入模型中,方便使用该变量。