基于three.js的shader入门教程 九

threejs交流群511163089

上回说到这个后期,可以涂鸦,或许你的作品是一张静止的很好看的图片,所以想要保留呐,咋个将图片弄到本地呐。

let pixelBuffer = new Uint8ClampedArray(4 * w * h);
renderer.readRenderTargetPixels(renderTarget, 0, 0, w, h, pixelBuffer);
let imgData = new ImageData(pixelBuffer, w, h);
createImageBitmap(imgData).then(function (bmp) { 
    let canvas = document.createElement('canvas');
	canvas.width = w;
	canvas.height = h;
	let context = canvas.getContext('2d');
	context.drawImage(bmp, 0, 0, w, h);
	let url = canvas.toDataURL('image/png');
});

利用了ImageBitMap这个东西,将rendertarget的纹理内容读入buffer,这里我只知道用renderer来读取这一种方法。至于别的办法,当然你也可以把那副画弄到默认绘制缓冲区,然后直接把画布导出。

基于three.js的shader入门教程 九_第1张图片

呐,需要绑定frameBuffer才能从帧缓冲区把东西弄出来。

你可能感兴趣的:(基于three.js的shader入门教程 九)