ThreeJs和Blender(使用colladaLoader):首次联系

因此，第一步是学习如何在ThreeJs中创建场景并使用Blender学习一些功能.准备就绪后，请创建您的第一个模型，并在导出之前牢记以下几点:

So, the first step is to learn how to create a scene in threeJs and learn some feature with Blender. When you are ready, create your first model and before exporting keep this in mind:

1. 您需要一个具有顶点的对象，因此，如果仅使用Blender创建文本，则必须将其转换为网格，否则threeJs将无法渲染它
2. 请务必选择Blender渲染选项，而不要选择循环"， 否则，导出的.dae文件将不会以threeJs呈现
3. 应用纹理时，仅使用颜色和基本材料(基本，phong和lambert)-其他将无法使用colladaLoader
4. 查看对象是否将以三个Js的颜色呈现 colladaLoader只是在Blender中以对象模式查看对象 (纯色)-如果是灰色而不是您选择的颜色，则为灰色 将以相同的方式在threeJs中渲染
5. 如果将'solidify'修饰符应用于对象，然后在threeJs上将其设置为透明，则将其渲染为线框
6. 如果您在场景中附加多个对象并加入"它们，则 各自的位置和旋转将以三秒为单位， 否则:例如，如果要在 瓶子(和thoose对象是不同的Blender文件，它们是 在场景中附加/链接)，则花朵将无法容纳在瓶子中 在三个Js中，但位置和旋转角度与 瓶子
7. 将对象分组并不能解决此问题:要在Blender中看到场景，您必须加入"对象(这将带来后果)或手动更改threeJs上的位置和旋转 .dae导出选项与在ThreeJs中渲染对象无关紧要.

1. you need to an object with vertices, so if you just create a text with Blender, you have to convert it to a mesh, otherwise threeJs will not render it
2. be sure to choose the Blender render option and not the Cycles, otherwise the .dae you export will not be rendered in threeJs
3. when applying a texture, use just colors and basic materials (basic, phong and lambert) - the others will not work using the colladaLoader
4. to see if the object will be rendered with color in threeJs with colladaLoader just look at object in Blender with object mode (solid) - if it's gray and not colored of the color you choose, it will be rendered in threeJs the same way
5. if you apply the 'solidify' modifier to the object and then on threeJs set it to transparent, it will be rendered as wireframed
6. if you append multiple objects in the scene and 'join' them, the respective positions and rotations will be respected in threeJs, otherwise not: for example, if you want to renderize a flower in the bottle (and thoose objects are different blender files which are appended/linked in the scene), the flower will not fit in the bottle in threeJs, but would have a different position and rotation than the bottle
7. grouping the objects will not solve this: to see the scene as you see it in Blender you have to 'join' the objects (with the consequences that this entails) or manually change position and rotation on threeJs the .dae export options don't matter for the rendering of the object in threeJs

现在，涉及到三个Js的部分:

and now, the part that regards threeJs:

请确保使用以下方式导入colladaLoader:

be sure to import the colladaLoader with:

<script src="jsLib/ColladaLoader.js"></script>

将此代码插入到init()函数中，以便加载程序加载您的.dae模型:

insert this code into your init() function so the loader will load your .dae model:

var loader = new THREE.ColladaLoader(); 
loader.options.convertUpAxis = true; 
loader.load( 'model.dae', function ( collada ) { 
  // with this you can get the objects of the scene; the [0] is not the first object 
  // you display in blender in case of many objects (which means you didn't join them) 
  var obj1 = collada.scene.children[0]; 
  // you can name the object so you can use it even out of the function, if you want 
  // animate it for example obj1.name = "daeObj1"; 
  // you can set here some material properties as trasparency 
  obj1.material.needsUpdate = true; 
  obj1.material.transparent = true; 
  obj1.material.opacity = 0.5; 
  obj1.hearth.material.wireframe = false; 
  // and now some position and rotation for good visualization 
  obj1.position.set(0, -5, -0.6); //x,z,y 
  obj1.rotation.set(0, 45, 0); 
  // and add the obj to the threeJs scene 
  scene.add(obj1); 
});

和一些代码添加到animate()函数中，如果您想更新某些对象(例如旋转)

and some code to the animate() function if you want to update some of your objects, with rotation for example

scene.traverse (function (object) { 
   if (object.name === 'daeObj1') { 
     object.rotation.z -= 0.01;
   }
 });

我希望有人可以从这篇文章中受益

I hope someone will benefit from this post