Convert a model from Maya to WebGL for use with THREE.js

转载 2012年03月24日 23:29:22

Convert a model from Maya to WebGL for use with THREE.js

    I’ve been a bit busy, but lots of folks have asked for this so here is the quick step by step on how I export from Maya to WebGL for use with three.js.

    Within the THREE.js github project, under utils/exporter there is a obj conversion tool called convert_obj_three.py. It’s written in python as a command line script, so a python executable is required to make it work. If you don’t have Python, you can download the version appropriate for your platform from python.org. I drop both the python.exe and convert_obj_three.py in the folder where I save my models, just to avoid typing lengthy paths into the command line.

    In Maya, there’s a few things which I do to retain consistancy in translations and scaling before importing the model in THREE.js. I ensure that the model’s xyz translation’s and rotation’s values are 0, and the xyz scaling is at 1. The model also needs to be a child of the world and not under any groups or objects, due to inheritated transformations from the parent group or object. At this point I delete any available history of the model, and select “freeze transformations” from the MODIFY menu.

                                                                       

    I export the model as an obj (make sure that the plugin(objExport) is loaded) into the folder I have the python converter script in. “All File Type Specific Options” can be left checked.

                                                                       

    Run cmd(command prompt). Go to the directory which the models and “convert_obj_three.py” is located and run the exectution line as such for a basic conversion:

                                                                      

-i for import, -o is output, -x is truncation and scaling. I typically use 1000 so it truncates the vertice values as intergers, and rescaling is easy to remember via 10, 100,1000 etc.

Now the exported model is ready for use in THREE.js. If transformations need to be inherrited from Maya, just multiply by 10, 100 or 1000 depending on your preferred scene scaling.

                                                                  

Maya导出动画到THREE.js(补充)

在《Maya 导出动画到THREE.js》中江同学已经讲解了大概的注意点,但我在使用过程中还是毫无避免的踩了坑(自己造的孽[捂脸]),把这个坑填一下吧。...
  • Twenty_sheep
  • Twenty_sheep
  • 2017年05月25日 11:25
  • 889

Threejs载入OBJ和贴图

Example 08.06 - Load OBJ model body { /* set mar...
  • daocaorencrl
  • daocaorencrl
  • 2015年01月15日 16:28
  • 10274

Three.js讲解以及WEBGL实例(转)

webGL可以让我们在canvas上实现3D效果。而three.js是一款webGL框架,由于其易用性被广泛应用。如果你要学习webGL,抛弃那些复杂的原生接口从这款框架入手是一个不错的选择。 自己...
  • dragoo1
  • dragoo1
  • 2016年05月17日 17:15
  • 3238

Maya 导出动画到THREE.js

本文主要针对THREE.js 提供的Maya 导出插件,提出插件存在的导出骨骼动画异常的问题,并给出做出相应的解决方案。...
  • jcq521045349
  • jcq521045349
  • 2016年09月22日 11:15
  • 2864

WebGL之Three.js开发第一个场景(含源码)

在h5火热的当下,各种绚丽的场景层出不穷。但是,我们是不是发现大部分或者说绝大部分的网站只是一个向用户展示信息的平台。至于用户与其进行的交互则仅限于下拉浏览,点击触发,或者填写一些表单信息。我一直在思...
  • laok_
  • laok_
  • 2017年07月21日 16:10
  • 658

大规模WebGL应用引发浏览器崩溃的几种情况及解决办法

一般的Web应用基本上不会导致浏览器崩溃,写Javascript代码也不需要管理内存资源,基本也不需要考虑内存“泄露”的问题。随着H5的崛起,越来越多的原本在桌面端的软件也改头换面迁移到Web上来,比...
  • mythma
  • mythma
  • 2016年06月04日 17:17
  • 16002

[webGL学习]基于three.js构建WebGL实例第四讲

今天我们继续我们的课程webGL 的学习,在该课程中我们将向大家展示如何给一个场景添加一个3D文字,如何设计出二维形状,把3D模型加载在OBJLoader现场。但这个过程是非常困难的.下面就具体来看一...
  • BaiHuaXiu123
  • BaiHuaXiu123
  • 2016年10月10日 22:11
  • 2423

[webGL学习]基于three.js构建WebGL实例第六讲

演示地址 今天我们继续webGL的课程。 今天我们开始另一个主题,我们将使用sprites和纹理动画。 如果你不知道,sprites只是图像,可以附加到对象上。 这些sprites图像总是与我们的...
  • BaiHuaXiu123
  • BaiHuaXiu123
  • 2016年10月13日 08:39
  • 3217

20个令人印象深刻的例子学习Three.js实现WebGL

1. Nucleal Nucleal is a WebGL experiment, powered by the Three.js. It breaks photos down into tho...
  • LateChangce
  • LateChangce
  • 2016年07月13日 01:22
  • 5954

【WebGL】茶壶和纹理

实验目的是实现混合纹理以及用键盘控制纹理切换 运行效果: 代码: 实验6 ...
  • lishichengyan
  • lishichengyan
  • 2017年12月28日 21:29
  • 52
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Convert a model from Maya to WebGL for use with THREE.js
举报原因:
原因补充:

(最多只允许输入30个字)