Question

我正在尝试在另一个webGL画布上绘制一个画布。这是我的代码。

function createCanvas(width, height) {
    var canvas = document.createElement('canvas');
    canvas.width = width;
    canvas.height = height;
    return canvas
}

var webGLCanvas = createCanvas(1, 1);
const gl = webGLCanvas.getContext("webgl");

function getColoredTexture(image, color, clip, scale, notWebgl) {
    if(!color || color === 'None') {
        if (notWebgl) {
            var charCanvas = createCanvas(clip.w * scale, clip.h * scale)
            var charContext = charCanvas.getContext("2d");
            charContext.drawImage(image,
                clip.x, clip.y, clip.w, clip.h,
                0, 0, clip.w * scale, clip.h * scale);
            return charCanvas;
        }
        else {
            return image
        }
    }
    // Create new canvas
    var charCanvas = createCanvas(clip.w * scale, clip.h * scale)
    var charContext = charCanvas.getContext("2d");
    // Draw letter on it
    charContext.fillStyle = 'black';
    charContext.fillRect(0, 0, charCanvas.width, charCanvas.height);
    charContext.drawImage(image,
        clip.x, clip.y, clip.w, clip.h,
        0, 0, clip.w * scale, clip.h * scale);
    // Apply color
    charContext.globalCompositeOperation = 'multiply';
    charContext.fillStyle = color;
    charContext.fillRect(0, 0, clip.w * scale, clip.h * scale);
    // Restore the transparency
    charContext.globalCompositeOperation = 'destination-atop';
    charContext.drawImage(image,
        clip.x, clip.y, clip.w, clip.h,
        0, 0, clip.w * scale, clip.h * scale);
    // Restore composite operation
    charContext.globalCompositeOperation = 'source-over';

    if (notWebgl) {
        return charCanvas
    }
    else {

        return gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, charCanvas);
    }
}

我正在为具有以下两种渲染模式的Construct 2编码：webgl和canvas。该代码非常适合画布渲染模式。我正在尝试将图像着色为给定的颜色并将其绘制。为此，我将图像绘制在小画布上，乘以我的颜色，然后再增加透明度。在webgl中，我想做同样的事情，而不是返回画布，而是要返回一个webGL Texture。但是，当我这样做时，会出现此错误：

WebGL：INVALID_VALUE：texImage2D：无画布

为什么会发生这种情况，我该怎么办？

Answer 1

在创建画布时，我将其高度设为0时犯了一个错误。

从画布获取webgl纹理

1 个答案: