首页 > 其他分享 >Threejs:创建几何体——图元

Threejs:创建几何体——图元

时间:2022-12-08 22:25:04浏览次数:41  
标签:Threejs const cube2 创建 0.01 THREE 几何体 new position

 

BoxGeometry盒子+MeshBasicMaterial

const geometry = new THREE.BoxGeometry(1, 1, 1);
const material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
const cube = new THREE.Mesh(geometry, material);
scene.add(cube);

其他辅助添加

// 设置坐标轴
const axesHelper = new THREE.AxesHelper(5);
scene.add(axesHelper);

// 设置轨道控制器
const controls = new OrbitControls(camera, renderer.domElement);
controls.update();
camera.position.z = 5;
// 设置地面网格
var gridHelper = new THREE.GridHelper(600, 30, 'yellow', 'gray');
gridHelper.position.y = -100;
gridHelper.position.x = 0;
scene.add(gridHelper);

 

使其动态起来

// 设置动画
function animate() {
  // 使物体旋转起来
  // cube.rotation.x += 0.01;
  // cube.rotation.y += 0.01;
  // cube2.position.y+= 0.01;
  // cube2.rotation.y += 0.01;
  // if(cube2.position.y>2){
  //     cube2.position.y=0;
  // };

  // 渲染场景
  renderer.render(scene, camera);
  requestAnimationFrame(animate);
}
animate();

 

标签:Threejs,const,cube2,创建,0.01,THREE,几何体,new,position
From: https://www.cnblogs.com/LIXI-/p/16967555.html

相关文章