please ask your question related to capturing.
ldu0009 opened this issue · 2 comments
ldu0009 commented
I'm trying to capture a canvas that has been rendered using angular-three, but I can't seem to capture it. The html2canvas library doesn't work, and using canvas.toDataURL() also doesn't work. How can I capture the canvas?
nartc commented
Have you tried:
<ngt-canvas [gl]="{ preserveDrawingBuffer: true }" />
ldu0009 commented
@nartc Oh! I didn't know there was such a clever way to do it! Thank you so much. I had been resolving the issue by forcibly running renderer.render(scene,camera) before executing getContext, but I will change it to this code.
this.renderer.render(this.scene, this.camera)
const canvas = this.canvas.rendererCanvas.nativeElement
const ctx = canvas.getContext('2d');
const base64 = this.renderer.domElement.toDataURL('image/png');
const blob = await this.base64ToBlob(base64)
const file = new File([blob], 'thumbnail.png')