Three.js 对创建的物体进行位置旋转缩放修改。

1.在场景里面添加一个物体作为示例

 // 创建一个物体(形状)
    const geometry = new THREE.BoxGeometry(5, 5, 5);
    //创建材质(外观)
    const material2 = new THREE.MeshLambertMaterial({
      color: 0xfff, //设置材质颜色
      side: THREE.DoubleSide, //设置两面可见
      transparent: true, //开启透明度
      opacity: 0.5, //设置透明度
    });
    // 创建一个网格模型对象
    const mesh = new THREE.Mesh(geometry, material2);
    this.scene.add(mesh);

2. 修改物体的位置

要修改物体的位置,直接访问其 position 属性,并设置其 xyz 值。

mesh.position.x = 2; // 设置 X 轴位置为 2
mesh.position.y = 1; // 设置 Y 轴位置为 1
mesh.position.z = -5; // 设置 Z 轴位置为 -5

set() 方法

  • 作用set() 方法用于设置对象的属性,可以将每个属性(例如位置的 x、y、z 坐标)分别指定为参数。
  • mesh.position.set(0, 2.5, 0); 

    set() 方法直接设置对象的属性值,如果调用时只提供部分参数,未指定的属性将保持不变(不会被清除为默认值)。

copy() 方法

  • 作用copy() 方法用于将另一个对象的属性复制到当前对象中,通常用于复制向量、颜色等对象。
  • 注意copy() 方法将完整地复制另一个对象的所有属性,覆盖当前对象的所有对应属性。如果参数对象有额外的属性,它们不会被考虑或复制。
let cc = new THREE.Vector3(0, 0.2, 0);
mesh.position.copy(cc);

3. 修改物体的旋转

mesh.rotation.x = Math.PI / 4; // 绕 X 轴旋转 45 度(π/4 弧度)
mesh.rotation.y = Math.PI / 3; // 绕 Y 轴旋转 60 度(π/3 弧度)
mesh.rotation.z = Math.PI / 6; // 绕 Z 轴旋转 30 度(π/6 弧度)


mesh.rotation.set(2, 1, 0.5); //旋转

假设有两个立方体 cube1cube2,你可以这样使用 copy 方法:

cube2.rotation.copy(cube1.rotation);

4. 修改物体的缩放

物体的缩放通过其 scale 属性进行设置。

cube.scale.set(2, 1, 0.5); // 在 X 轴上放大两倍,Y 轴保持原大小,Z 轴缩小为原来的一半

 

相关推荐

  1. C#使用Matrix类Dicom图像

    2024-07-13 15:14:02       65 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-07-13 15:14:02       67 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-07-13 15:14:02       72 阅读
  3. 在Django里面运行非项目文件

    2024-07-13 15:14:02       58 阅读
  4. Python语言-面向对象

    2024-07-13 15:14:02       69 阅读

热门阅读

  1. 子组件向父组件传参的方式

    2024-07-13 15:14:02       18 阅读
  2. 分布式系统—Ceph对象存储系统(RGW接口)

    2024-07-13 15:14:02       22 阅读
  3. Dubbo3+naocs2环境搭建

    2024-07-13 15:14:02       22 阅读
  4. 利率债的收益水平

    2024-07-13 15:14:02       19 阅读
  5. c++深度优先和广度优先

    2024-07-13 15:14:02       18 阅读
  6. 码元的周期

    2024-07-13 15:14:02       23 阅读