학습 three.js는 도전적으로 도움이됩니다.
Renderer
함수는 새 DOM 요소를 만들고 그 위에 Scene
을 그립니다.
목표를 달성하는 가장 쉬운 방법은이 Three.js DOM 요소보다 높은 ui에있는 다른 모든 요소의 z-index
CSS 속성을 설정하는 것입니다.
이것이 현재 Stats Element
(현재 FPS를 보여주는 것)이 webGL 요소 위에 어떻게 위치하는지입니다.
업데이트 1 : 그것은 하나를 발견하지 않는 경우
당신이 DOM 또는 찾을 수 WebGLRenderer의 threejs 구현 보면, 그것은 캔버스 요소를 만듭니다. 변경 소재 색상 :
이 같은 threejs의 색상을 초기화 할 수 있으므로 CSS에 당신은 당신의 원하는 결과
업데이트 2를 달성하기 위해 부정적이 요소의 z-index 속성을 설정할 수 있습니다.
var desiredColor= new THREE.Color(0xff0000);
또는
var desiredColor= new THREE.Color("rgb(255,0,0)");
공식 문서
는 다음 방금 단지 render
함수에서 다음 코드 줄을 제거하여 재료의 색상 속성이 색상을 설정할 필요가 here
color = bird.material.color;
color.r = color.g = color.b = (500 - bird.position.z)/1000;
및 addin g 대신에이 줄을 써라. 그 재료로 색을 변경하는 것이 아주 쉽게 ... 에서 렌더링 함수를 그냥 ... 당신이 새의 임의의 색상을 볼 수 아래에 언급 된 줄을 제거
bird.material.color= desiredColor; // in this case it will change all bird's color to red
나는 Three.js를 작동하는 방법을 배우는 것이 좋습니다. – undefined