Three.js - 绕特定轴旋转对象

2023-12-08

我用过三个={REVISION:"68"}

我已经按轴完成了旋转(OBJECT_X)"z"http://jsfiddle.net/eVkgs/39/

当我更改位置 OBJECT_X 时:CubeGeometry.applyMatrix( new THREE.Matrix4().makeTranslation( 20,Cube_height/2, 0 ) ); http://jsfiddle.net/eVkgs/40/

对象仍然按轴“z”旋转,因为我设置:OBJECT_X.rotation.z += 0.3*Math.PI/30;

Question:应该如何查看允许围绕该对象放置的轴旋转的代码?


对象将绕其局部坐标系中的原点旋转。如果你想移动原点,那么你必须平移几何本身。以下是要遵循的模式:

geometry.translate( dx, dy, dz );

您现在可以从几何体创建网格,并设置网格位置:

mesh.position.set( x, y, z );

如果旋转网格,它将绕其新原点旋转,并且网格将位于点 ( x, y, z )。

三.js r.84

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Three.js - 绕特定轴旋转对象 的相关文章

  • Threejs + Vanilla JS 和 React-Three-Fiber + Create-React-App 之间的颜色差异

    这已经困扰我一段时间了 为什么 React Three Fiber 中的材质颜色看起来比 Threejs 中暗淡 两种实现中的对象及其属性是相同的 Threejs 版本相同 在新引导中实施 create react app 没有额外的依赖项
  • 如何沿着简单的路径移动相机

    如何沿着简单的路径 由顶点 点数组创建 移动相机 我需要自动移动它 而不是像第一人称射击游戏那样通过键盘 鼠标事件来移动它 找了这个例子 http trijs org examples webgl geometry extrude spli
  • 扩展 Three.js 类

    我想扩展 Three js Object3D 类 但不知道该怎么做 有一个 Stackoverflow 问题 我已经阅读 重新阅读和尝试过 但无法让它为我工作 有没有办法扩展 ThreeJS 对象 https stackoverflow c
  • THREE.js 导入的模型不应用面部纹理

    我正在尝试导入使用 THREEJS 导出器从搅拌机导出的模型 到目前为止 模型已加载并出现在我的场景中 并且正确应用了材质 汽车应为黄色 玻璃应为透明 但它并没有将我的纹理应用到以 tga 形式保存的汽车上 如果我不将纹理包含在模型所在的服
  • 在 Three.js 中渲染具有大量对象的多个场景的最佳方式

    想象一下 您想要绘制两个场景 每个场景都有数百个球体 并提供在这些场景之间切换的功能 做到这一点的最佳方法是什么 目前 一个开关大约需要 4 到 5 秒 因为我要删除 创建和绘制每个开关上的所有球体 下面是在场景切换上运行的代码示例 cle
  • 在 Three.js 中将贝塞尔曲线转换为平面道路

    我试图根据之前计算得到的一些贝塞尔曲线在 Three js 中绘制一条弯曲的道路 问题是我找不到转换曲线序列的方法 一条从上一条曲线的末尾开始 到一个曲面 我有一个 3D 场景 其中有一些汽车 一条用飞机创建的道路 并且绘制了即将到来的道路
  • 将颜色渐变应用于网格上的材质 - Three.js

    我有一个 STL 文件加载到我的场景中 并将单一颜色应用于 phong 材质 我想要一种方法 将两种颜色应用于该网格物体的材质 并在 Z 轴上应用渐变效果 如下例所示 渐变花瓶 https i stack imgur com Ty9gq j
  • Three.js - 将 WebGL 和 CSS3D 与 iFrame 混合

    我准备了一个混合的工作页面WebGL and CSS3D 在SO的一点帮助下here https stackoverflow com questions 24681170 three js properly blending css3d a
  • Three.js 椭圆

    如何在 Three js 中创建一个椭圆 我看过这个 在 THREE js 中绘制椭圆 https stackoverflow com questions 11419896 drawing an ellipse in three js 但如
  • 在 Webpack 中使用 Three.js 以便我可以使用 OrbitControls 的正确方法是什么?

    在我的 webpack 配置中 resolve alias three path resolve node modules three build three js OrbitControls path resolve node modul
  • 无面点云 (PLY) 文件的 Web 查看器

    我在尝试Three Js https github com mrdoob three js 用于通过网络查看 PLY 文件 使用这个例子 http threejs org examples webgl loader ply html作为参考
  • CSS3DObject 始终位于 WebGL Mesh 前面

    我正在混合CSS3D Renderer with WebGL Renderer to add HTML3D 空间中的元素WebGL场景 这CSS3DObject在前面WebGL网格即使WebGL Renderer具有较高的 z index
  • 如何在 React Native 中渲染自定义 3D 对象

    我已经成功使用 Three js expo Three 和 expo gl 在 React Native 中配置了红色立方体的 3D 渲染 但我想让用户渲染他们自己可能拥有的自定义 3D 对象 obj 或 mtl 扩展名 但我不确定如何让他
  • 如何在 Three.js 中进入全屏?

    我已经尝试了数十种不同的方法几个小时 但没有一个有效 如下所示 document body addEventListener keydown function THREEx FullScreen request false 如何让Three
  • 三个JS,给纹理添加镜面反射(光泽)

    我有一个纹理应用于 Three js 中的对象 我想为其添加一些镜面反射或光泽 我看到这样的例子 new THREE MeshPhongMaterial color 0x996633 specular 0x050505 shininess
  • 三.js、PointerLock和碰撞检测

    我正在开发一个 3D 虚拟家庭项目 除了碰撞检测之外 一切正常 我使用 PointerLockControls 来控制相机和移动 但我不确定如何检测每个可能方向的碰撞 为简单起见 我从与 0 0 0 上的简单立方体的向前和向后碰撞开始 ra
  • 使用 Three.js 中的设备方向控件进行对象旋转

    我正在迈出使用 JavaScript 进行编码并使用 Three js 的第一步 我正在尝试 Threejs org 的这个例子 http trijs org examples misc controls deviceorientation
  • 如何检查 webgl(two.js) 的客户端性能

    我有一个使用 Three JS 的图形项目 现在我想自动检查客户端 GPU 性能并计算可以在应用程序中加载多少元素 我想到了诸如 GPU 基准测试之类的东西 看一眼stats js https github com mrdoob stats
  • Morph 目标为 Three.js

    我正在尝试开始使用变形目标和 Three js 然而 关于这个主题的文档似乎并不多 当我查看源代码时 morphTargetInfluences 似乎是有魔力 这是如何运作的 我该如何使用这个 值为1就是全力吗 如何区分同一模型上的不同变形
  • 如何将 ThreeJS 与 PhoneGap 一起使用?

    这个探索是非常自我描述的 我已经用一个简单的 3D 立方体进行了测试 它在浏览器中运行良好 但只在模拟器中显示空白页面 有人说 Threejs 不能与 PhoneGap 一起使用 但也有人说他们使用过并且工作正常 在 Android 中 您

随机推荐