Three.js - 텍스처를 이미지로 내보내기

Question

내 장면의 일부를 렌더링하고 이것을 내 객체의 텍스처로 사용합니다. 하지만 이제이 텍스처를 이미지로 내보내려고합니다. 그것에 대한 어떤 생각?

이 내 텍스처 개체를 만드는 방법은 다음과 같습니다

frameTexture = new THREE.WebGLRenderTarget(window.innerWidth, window.innerHeight, { minFilter: THREE.LinearFilter, magFilter: THREE.NearestFilter}); 

을 그리고 내 물질에 질감을 지정 :

var material = new THREE.MeshBasicMaterial({map:frameTexture.texture}); 

을 그리고 이것은 내가 텍스처를 렌더링하는 방법입니다

renderer.render(frameScene,frameCamera,frameTexture); 

이제 frameTexture를 이미지로 저장하는 방법에 대해 질문합니다.

Answer 1

캔버스에 이미지를 렌더링 한 후 전화 toDataURL

renderer.render(sceneThatHasASingleQuadPlaneUsingFrameTexture, camera); 
var dataURL = renderer.domElement.toDataURL(); 

이제 개방과 같은 그 dataURL와

var img = new Image(); 
img.src = dataURL; 
document.body.appendChild(img); 

그것의 이미지를 만들

window.open(dataURL, "image"); 

또는 창을 일을 할 수있다

XHR을 통해 서버로 보내기

,210

const xhr = new XMLHttpReqeust(); 
xhr.open('PUT', 'https://myserverthatsavesimages.com', true); 
xhr.send(dataURL); 
... 

기타 ... 좋은 생각이다