坐标轴辅助器(AxesHelper)
用于简单模拟3个坐标轴的对象.
红色代表 X 轴. 绿色代表 Y 轴. 蓝色代表 Z 轴.
const axesHelper = new THREE.AxesHelper( 5 );
scene.add( axesHelper );
文档地址:https://threejs.org/docs/index.html#api/zh/helpers/AxesHelper
构造函数(Constructor)
AxesHelper( size : Number )
size -- (可选的) 表示代表轴的线段长度. 默认为 1
.
方法(Methods)
.setColors ( xAxisColor : Color, yAxisColor : Color, zAxisColor : Color ) : this
将轴颜色设置为 xAxisColor, yAxisColor,zAxisColor。
.dispose () : undefined
释放此实例分配的GPU相关资源。每当应用程序中不再使用此实例时,请调用此方法。
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
const geometry = new THREE.BoxGeometry(2, 2, 2);
const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const cube = new THREE.Mesh( geometry, material );
scene.add(cube);
camera.position.z = 5;
const controls = new OrbitControls( camera, renderer.domElement );
// 坐标轴
const axesHelper = new THREE.AxesHelper( 5 );
scene.add( axesHelper );
function render() {
renderer.render(scene, camera);
requestAnimationFrame(render);
}
render();
展示效果:
标签:scene,const,THREE,three,坐标轴,renderer,new,js,AxesHelper From: https://www.cnblogs.com/shangguancn/p/18029518