Helpers

디버깅과 시각적인 가이드를 제공합니다. scene 내에서 가이드 라인, 축, 경계 상자 등을 생성하여 개발자에게 도움을 줍니다.ㅎ

GridHelper

GridHelper는 그리드를 정의하는 객체입니다. 그리드는 2차원 선 배열입니다.

GridHelper(size?: number, divisions?: number, color1?: THREE.ColorRepresentation, color2?: THREE.ColorRepresentation): THREE.GridHelper

• size : The size of the grid. Default 10
• divisions : The number of divisions across the grid. Default 10
• olorCenterLine : The color of the centerline. This can be a THREE.Color Color, a hexadecimal value and an CSS-Color name. Default 0x444444
• colorGrid : The color of the lines of the grid. This can be a THREE.Color Color, a hexadecimal value and an CSS-Color name. Default 0x888888

const gridHelper = new THREE.GridHelper( 10, 10 );

AxesHelper

3개의 축을 간단한 방식으로 시각화하는 축 객체.
X축은 빨간색입니다. Y축은 녹색입니다. Z축은 파란색입니다.

AxesHelper(size?: number): THREE.AxesHelper

• size : Size of the lines representing the axes. Default 1

## ArrowHelper
> raycater(광선 방향)을 확인할 때 유용하다. 

ArrowHelper(dir?: THREE.Vector3, origin?: THREE.Vector3, length?: number, color?: THREE.ColorRepresentation, headLength?: number, headWidth?: number): THREE.ArrowHelper

- dir : Direction from origin. Must be a unit vector. Default new THREE.Vector3(0, 0, 1)
- origin : Point at which the arrow starts. Default new THREE.Vector3(0, 0, 0)
- length : Length of the arrow. Default 1
- hex : Hexadecimal value to define color. Default 0xffff00
- headLength : The length of the head of the arrow. Default 0.2 * length
- headWidth : The width of the head of the arrow. Default 0.2 * headLength

> raycater에서  ArroHelper 사용법

scene.add(new THREE.ArrowHelper(raycaster.ray.direction, raycaster.ray.origin, 300, 0x00ff00) );

## VertexNormalsHelper
> 객체의 vertex normals을 시각화합니다. 사용자 정의 속성에 노멀이 지정되었거나 ComputeVertexNormals를 사용하여 계산되어야 합니다.
### Import

import { VertexNormalsHelper } from 'three/addons/helpers/VertexNormalsHelper.js';

### Constructor

new VertexNormalsHelper(object: THREE.Object3D, size?: number, hex?: number): VertexNormalsHelper