Webgl clear() 问题答案

【问题标题】：Webgl clear() issueWebgl clear() 问题
【发布时间】：2017-01-08 16:49:31
【问题描述】：

我将一个简单的 WebGL 示例移植到 Transcrypt（请参见下面的代码），并尝试一下，它就成功了！除了一个细节；似乎 gl.clear() 调用在某种程度上没有正确翻译，因为它在 Firefox 中给出了以下错误：

TypeError: gl.py_clear is not a function

注释掉该行会使示例工作。

Python：

from org.transcrypt.stubs.browser import document, __new__


def make_shader(gl, vs, fs):

    prog = gl.createProgram()

    def add_shader(type_, source):
        s = gl.createShader(gl.VERTEX_SHADER
                            if (type_ == 'vertex')
                            else gl.FRAGMENT_SHADER)
        gl.shaderSource(s, source)
        gl.compileShader(s)
        if not gl.getShaderParameter(s, gl.COMPILE_STATUS):
            return
        gl.attachShader(prog, s)

    add_shader('vertex', vs)
    add_shader('fragment', fs)
    gl.linkProgram(prog)
    if not gl.getProgramParameter(prog, gl.LINK_STATUS):
        raise RuntimeError("Could not link the shader program!")

    return prog


def attribute_set_floats(gl, prog, attr_name, rsize, arr):
    gl.bindBuffer(gl.ARRAY_BUFFER, gl.createBuffer())
    gl.bufferData(gl.ARRAY_BUFFER, __new__(Float32Array(arr)),
                  gl.STATIC_DRAW)
    attr = gl.getAttribLocation(prog, attr_name)
    gl.enableVertexAttribArray(attr)
    gl.vertexAttribPointer(attr, rsize, gl.FLOAT, False, 0, 0)


def draw():
    gl = document.getElementById("webgl").getContext("webgl")
    gl.clearColor(0.8, 0.8, 0.8, 1.0)  
    gl.clear(gl.COLOR_BUFFER_BIT)  # <- error!

    prog = make_shader(gl,
                       ("attribute vec3 pos;"
                        "void main() {"
                        "    gl_Position = vec4(pos, 2.0);"
                        "}"),
                       ("void main() {"
                        "    gl_FragColor = vec4(0.5, 0.5, 1.0, 1.0);"
                        "}"))

    gl.useProgram(prog)

    attribute_set_floats(gl, prog, "pos", 3, [
        -1, 0, 0,
        0, 1, 0,
        0, -1, 0,
        1, 0, 0
    ])

    gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4)


draw()

HTML：

html
<!DOCTYPE html>
<html>
    <head>
    <meta charset="utf-8" />
    <title>Example</title>
    </head>
    <body>
        <canvas id="webgl" width="640" height="480"></canvas>
        <script type="text/javascript" src="__javascript__/webgl.js">
        </script>
    </body>
</html>

【问题讨论】：

标签： javascript python transcrypt

【解决方案1】：

名称 'clear' 是一个别名，否则它会与 Python 字典 'clear' 方法发生冲突，该方法接受 Transcrypt 的特殊处理以允许任意字典内容。

（Transcrypt 无法预测对象或变量的类型，因为 Python 是动态类型的。）

如果你改用“js_clear”，它应该可以工作，所以：

gl.js_clear(gl.COLOR_BUFFER_BIT)

两种选择，在我看来都不是首选：

使用__pragma__ ('js', '{}', 'gl.js_clear(gl.COLOR_BUFFER_BIT)')
使用__pragma__ ('noalias', 'clear') 在本地取消别名'clear'

所有预定义的别名都列在：

http://www.transcrypt.org/docs/html/special_facilities.html#pragma-alias

还解释了如何取消别名。

【讨论】：