相关疑难解决方法(0)

threejs如何围绕对象自己的中心旋转,而不是围绕世界中心

在此输入图像描述

场景中的两个对象.立方体旋转轴应该是立方体的中心,这是我的期望.

但鞋模的旋转轴是世界的y轴.

我的原始代码是.

cube.rotation.y += 0.01;
shoe.rotation.y += 0.01;
Run Code Online (Sandbox Code Playgroud)

我在stackoverflow中找到了一个解决方案,如下所示:

cube.rotation.y += 0.01;
var pivot = new THREE.Object3D();
pivot.add(shoe);
pivot.rotation.y += 0.01;
Run Code Online (Sandbox Code Playgroud)

但它不起作用.然后,我改变鞋子的位置.

cube.rotation.y += 0.01;
var pivot = new THREE.Object3D();
shoe.position.set(-5,0,0);
pivot.add(shoe);
pivot.rotation.y += 0.01;
Run Code Online (Sandbox Code Playgroud)

现在结果更好,但仍然不完美.而且由于鞋子的型号很多,我无法确定每种鞋型的不同位置.

rotation three.js

45
推荐指数
3
解决办法
3万
查看次数

如何在轴three.js上旋转3D对象?

我有一个很好的关于旋转的问题.我希望在我的一个游戏中旋转我的3D立方体.

//init
geometry = new THREE.CubeGeometry grid, grid, grid
material = new THREE.MeshLambertMaterial {color:0xFFFFFF * Math.random(), shading:THREE.FlatShading, overdraw:true, transparent: true, opacity:0.8}
for i in [1...@shape.length]
    othergeo = new THREE.Mesh new THREE.CubeGeometry(grid, grid, grid)
    othergeo.position.x = grid * @shape[i][0]
    othergeo.position.y = grid * @shape[i][1]
    THREE.GeometryUtils.merge geometry, othergeo
@mesh = new THREE.Mesh geometry, material

//rotate
@mesh.rotation.y += y * Math.PI / 180
@mesh.rotation.x += x * Math.PI / 180
@mesh.rotation.z += z * Math.PI / 180
Run Code Online (Sandbox Code Playgroud)

和(x,y,z)可以是(1,0,0)

然后立方体可以旋转,但问题是立方体在其自己的轴上旋转,因此在旋转后,它不能按预期旋转.

我找到页面如何围绕轴旋转Three.js Vector3?,但它只是让Vector3点围绕世界轴旋转? …

javascript coffeescript three.js

34
推荐指数
6
解决办法
11万
查看次数

如何在轴世界上旋转一个物体three.js?

是否有可能轮换世界的轴而不是物体?

我需要做一些物体的旋转,但是在第一次旋转后,我不能像我想的那样做其他旋转.

如果无法在世界轴上进行旋转,我的第二个选择是在第一次旋转后重置轴.这有什么功能吗?

我无法使用,object.eulerOrder因为它在我object.eulerOrder="YZX"进行一些旋转后设置时会改变对象的方向.

javascript three.js

15
推荐指数
1
解决办法
2万
查看次数

Three.js - 围绕某个轴旋转球体

我有个问题.在Three.js中,我想围绕轴旋转一个球体(地球),倾斜23.5度.我找到了sphere.rotation.x,sphere.rotation.y和sphere.rotation.z,但是当我以正确的比例组合它们时,球体的旋转非常奇怪 - 它没有永久旋转轴.我想我需要像sphere.rotation.vector(1,0,-1)这样的函数.有谁知道如何调用此函数以及正确的语法是什么?

非常感谢您的回答!

javascript axis vector rotation three.js

13
推荐指数
2
解决办法
2万
查看次数

三个JS Pivot点

我想要实现的是围绕枢轴点旋转几何体并使其成为几何体的新定义.我不希望继续编辑rotationZ,但我想让当前的rotationZ成为新的rotationZ 0.

这样,当我创建一个新的旋转任务时,它将从新的给定枢轴点和新给定的rad开始.

我尝试了什么,但旋转点移动了:

// Add cube to do calculations
var box = new THREE.Box3().setFromObject( o );
var size = box.getSize();
var offsetZ = size.z / 2;

o.geometry.translate(0, -offsetZ, 0)

// Do ratation
o.rotateZ(CalcUtils.degreeToRad(degree));

o.geometry.translate(0, offsetZ, 0)
Run Code Online (Sandbox Code Playgroud)

我还尝试添加一个组并旋转该组,然后删除该组.但是我需要在没有所有额外物体的情况下保持旋转.我创建的代码

var box = new THREE.Box3().setFromObject( o );
    var size = box.size();

    var geometry = new THREE.BoxGeometry( 20, 20, 20 );
    var material = new THREE.MeshBasicMaterial( { color: 0xcc0000 } );

    var cube = new THREE.Mesh( geometry, material );

    cube.position.x = o.position.x;
    cube.position.y …
Run Code Online (Sandbox Code Playgroud)

javascript three.js

9
推荐指数
2
解决办法
7180
查看次数

three.js围绕Y轴旋转Object3d

我有一个Object3dThree.JS这是一组有些网格对象.
我想围绕Y轴旋转这个组,在它的中心,远离世界中心(0,0,0).
我只知道Group.rotate.y += deg代码,但是对于每个轴方向,它总是围绕(0,0,0)旋转对象,而不是我的组中心!
我怎样才能解决这个问题?

更新:

阅读评论

3d rotation three.js

8
推荐指数
2
解决办法
3万
查看次数

在Three.js中的任何位置旋转特定轴上的对象 - 包括网格外部

尝试围绕任何轴旋转对象.

例如,像门铰链(在物体的边缘上)或围绕太阳的行星(在物体外部).

问题似乎是定义轴.下面的单位矢量导致轴保留在对象的原点(中心)上,因此与标准旋转相同:

object2.rotateOnAxis(new THREE.Vector3(1,0,0), 0.01);
// same as
object1.rotation.x += 0.01;
Run Code Online (Sandbox Code Playgroud)

请参阅代码示例:JSFiddle

编辑:寻找一种可以绕枢轴旋转而不使用嵌套子项的方法.旋转孩子的父母提供了一种操纵孩子枢轴点的简单方法,但修改枢轴点是不可行的.

下面的例子,如果你想在图8的运动中旋转立方体,可以通过改变父对象来实现这个方法.但是必须确保新父母的位置和方向被精确配置以使孩子在父母之间无缝跳跃,并且不重复或循环的复杂运动将非常复杂.相反,我想(并且我将解释问题标题)在特定轴上旋转对象而不使用对象嵌套在场景中的任何位置,包括对象网格的外部.

请参阅代码示例:JSFiddle with pivotots

javascript 3d three.js

4
推荐指数
1
解决办法
2606
查看次数

旋转锚点在Three.js

我正在定义一个锥体,我需要能够绕其顶点旋转(锥体厚度最小的点).我找不到设置旋转发生点的方法.

var coneGeometry = new THREE.CylinderGeometry(1000, 0, width, 50, 50, false);
var cone = new THREE.Mesh(coneGeometry, material);
cone.position.x = x;
cone.position.y = y + width / 2;
cone.position.z = z;
// I want this rotation to happen around the point given by the (x, y, z) location
cone.rotation.x = dip;
Run Code Online (Sandbox Code Playgroud)

javascript three.js

3
推荐指数
1
解决办法
5881
查看次数

在three.js中将向量从全局空间转换为局部向量

在场景中有旋转的对象时​​,如何将全局矢量转换到该旋转对象的局部空间中,以便在全局矢量的同一位置渲染它们?

以一个旋转但处于全局原点的多维数据集为例。现在,我想为每个全局尺寸(x,y,z)渲染线,但是将它们作为子级添加到旋转的多维数据集而不是全局场景中。如何计算并在three.js中实现这些向量的旋转,以便它们对齐?

javascript 3d three.js

2
推荐指数
1
解决办法
3611
查看次数

标签 统计

three.js ×9

javascript ×7

3d ×3

rotation ×3

axis ×1

coffeescript ×1

vector ×1