Take the 2-minute tour ×

I have an interesting problem. I'm drawing text with a custom font to a canvas, then loading that canvas's image data into a GL texture. The problem is the transparency of the background. I can't get the GL texture to have the proper alpha. The background of it is black.

See here:

(Stackoverflow won't let me post the link directly... sorry...)

Relevant code:

this.ctx.clearRect(0,0, this.textCanvas.width, this.textCanvas.height); 
this.ctx.fillText(textObj.text, this.textCanvas.width / 2, this.textCanvas.height / 2);

gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, false); 
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas);

EDIT: I'm an idiot.

this.gl.enable (this.gl.BLEND);
this.gl.blendFunc(this.gl.SRC_ALPHA, this.gl.ONE_MINUS_SRC_ALPHA);
share|improve this question
please provide relevant code in a filtered-down test-case. A link doesn't help anybody - especially when you have that much code. Also a link becomes redundant (due to link-rot) to future users with the same or similar issue. –  ahren Dec 9 '12 at 20:43
I'm not really sure what to post. Seeing the actual issue is probably the most helpful. Hmm, I'll see. Basically, this line: gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas); It should load the canvas with the alpha channel, right? –  Kyle Emmerich Dec 9 '12 at 20:45

Your Answer



Browse other questions tagged or ask your own question.