기하학면의 점 색상 얻기

Question

THREE.js를 사용하여 장면을 렌더링하고 있는데 까다로운 질문이 있습니다 - 기하학면의 특정 점의 색상은 어떻게 얻을 수 있습니까?

색상은 특정 위치에서의 재질, 얼굴색 및 질감 색상을 기준으로 한 특정 시점의 실제 출력 색상을 의미하는 것은 아닙니다. 예를 들어 주어진 점에서 얼굴의 질감이 빨강이고 재료 색상이 반쯤 보이는 경우 (alpha = 0.5), 다음과 같이 예상됩니다. (r = 1.0, g = 0.0, b = 0.0, a = 0.5).

참고 : 성능이 중요합니다.

아이디어가 있으십니까? 감사합니다.

Answer 1

사용 가능 실제로 실제로 얻으려고하는 것은 사실이 아닙니다. 당신은 빛을 고려하고 있지 않습니다. 조명이 없으면 물체가 검은 색이됩니다. 조명과 함께 빛의 위치에 따라 다른 결과를 얻을 수 있습니다. 플랫 쉐이딩을 사용하더라도 얼굴의 색은 정상에 따라 다릅니다.

Answer 2

<canvas>으로 간단하고 직접적인 방법이 될 수 있습니다.

var canvas = document.createElement('canvas'); 
canvas.width = renderer.domElement.width; 
canvas.height = renderer.domElement.height; 

var context = canvas.getContext('2d'); 
context.drawImage(renderer.domElement, 0, 0); 

var imagedata = context.getImageData(0, 0, canvas.width, canvas.height); 
var data = imagedata.data; 

var index = (mousex + (mousey * canvas.width)) * 4; 

var red = data[ index ]; 
var green = data[ index + 1 ]; 
var blue = data[ index + 2 ]; 

var hex = red << 16 | green << 8 | blue << 0