Question

调试器语句（以确定的方式停止）给我一个＆＃34; ERROR未声明的标识符＆＃34;在铬。源代码是JavaScript WebGL 我甚至试图在正确运行的页面中设置断点。我启用了WebGL Inspector扩展并检查了“允许访问文件URL＆＃34;框我很抱歉打扰任何人，因为我遗漏了一些明显和基本的东西。

朱莉娅矿井

<script id="shader-vs" type="x-shader/x-vertex">
    attribute vec3 vPos;

    void main(void) {
        gl_Position = vec4(vPos, 1.);
    }
</script>

<script id="shader-fs" type="x-shader/x-fragment">
    precision mediump float;
    uniform vec2 c;
    uniform vec2 scale;
    void main(void) {
        float x1 = 2.0;
        float y1 = -2.0;
        float R = (gl_FragCoord.x - scale.x) / scale.y;
        float I = (gl_FragCoord.y - scale.x) / scale.y;

        //   float R2 = R*R, I2 = I*I;
        float R2 = R;
        debugger;
        float I2 = I;
        int mm;
        for (int m = 0; m < 255; m++) {
            debugger;
            x1 = 2.0 + exp(R2) / 2.0 * cos(I2);
            y1 = -2.0 + exp(R2) * sin(I2);
            if (x1 >= 0.0000001) break;
            R2 = x1;
            I2 = y1;
        } //end for m
        if (mm == 254) gl_FragColor = vec4(0., 0., 0., 1.);
        else {
            float a = float(mm);
            a = mod(a, 15.) / 5.;

            gl_FragColor = vec4(max(0., abs(a - 1.5) - .5),
                max(0., 1. - abs(a - 0.8)), max(0., 1. - abs(a - 2.)), 0.94);
        } //end else
    }
</script>

<script type="text/javascript">
    function getShader(gl, id) {
        var shaderScript = document.getElementById(id);
        var str = "";
        var k = shaderScript.firstChild;
        while (k) {
            if (k.nodeType == 3) str += k.textContent;
            k = k.nextSibling;
        }
        var shader;
        if (shaderScript.type == "x-shader/x-fragment")
            shader = gl.createShader(gl.FRAGMENT_SHADER);
        else if (shaderScript.type == "x-shader/x-vertex")
            shader = gl.createShader(gl.VERTEX_SHADER);
        else return null;
        gl.shaderSource(shader, str);
        gl.compileShader(shader);
        if (gl.getShaderParameter(shader, gl.COMPILE_STATUS) == 0)
            alert(gl.getShaderInfoLog(shader));
        return shader;
    }

    var gl, canvas;
    var cLoc, size, frames = 0,
        timer_fr, time,
        n = 8,
        k, To = 30,
        T, Tp, animation = true;
    var orb = [
        [.248, 0, .15],
        [.27, 0, .2],
        [.33, .033, .1],
        [.42, .228, .1],
        [.27, .564, .1],
        [-.162, .78, .1],
        [-.534, .612, .1],
        [-.726, .3, .1],
        [-.75, .0, .05],
        [.248, 0, .15]
    ];

    function webGLStart() {
        canvas = document.getElementById("canned");
        size = Math.min(window.innerWidth, window.innerHeight) - 35;
        canvas.width = size;
        canvas.height = size;
        if (!window.WebGLRenderingContext) {
            alert("Your browser does not support WebGL. See http://get.webgl.org");
            return;
        }
        try {
            gl = canvas.getContext("experimental-webgl");
        } catch (e) {}
        if (!gl) {
            alert("Can't get WebGL");
            return;
        }
        gl.viewport(0, 0, size, size);

        var prog = gl.createProgram();
        gl.attachShader(prog, getShader(gl, "shader-vs"));
        gl.attachShader(prog, getShader(gl, "shader-fs"));
        gl.linkProgram(prog);
        gl.useProgram(prog);

        var posAtrLoc = gl.getAttribLocation(prog, "vPos");
        gl.enableVertexAttribArray(posAtrLoc);
        var posBuffer = gl.createBuffer();
        gl.bindBuffer(gl.ARRAY_BUFFER, posBuffer);
        var vertices = new Float32Array([-1, -1, 0, 1, -1, 0, -1, 1, 0, 1, 1, 0]);
        gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW);
        gl.vertexAttribPointer(posAtrLoc, 3, gl.FLOAT, false, 0, 0);
        cLoc = gl.getUniformLocation(prog, "c");
        gl.uniform2f(gl.getUniformLocation(prog, "scale"), size / 2, size / 3);
        time = new Date().getTime();
        k = 0;
        Tp = -1;
        T = time / 1000 + orb[k][2] * To;
        timer_fr = setInterval(fr, 500);
        anim();

        canvas.resize = function () {
            var size = Math.min(window.innerWidth, window.innerHeight) - 35;
            canvas.width = size;
            canvas.height = size;
            gl.uniform2f(gl.getUniformLocation(prog, "scale"), size / 2, size / 3);
            gl.viewport(0, 0, size, size);
            draw();
        }
    }

    function anim() {
        var tim = new Date().getTime() / 1000;
        var a = (T - tim) / (To * orb[k][2]);
        gl.uniform2f(cLoc, orb[k][0] * a + orb[k + 1][0] * (1 - a),
            orb[k][1] * a + orb[k + 1][1] * (1 - a));
        draw();
        if (tim > T) {
            k++;
            if (k > n) k = 0;
            T += orb[k][2] * To;
        }
        frames++;
        if (animation) requestAnimationFrame(anim);
    }

    function draw() {
        gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
    }

    function setT(v) {
        To = v.valueOf();
    }

    function run(v) {
        if (animation) {
            animation = false;
            Tp = new Date().getTime() / 1000;
            document.getElementById('runBtn').value = "Run ";
        } else {
            animation = true;
            if (Tp > 0) {
                T += new Date().getTime() / 1000 - Tp;
                Tp = -1;
            }
            anim();
            document.getElementById('runBtn').value = "Stop";
        }
    }

    function fr() {
        var ti = new Date().getTime();
        var fps = Math.round(1000 * frames / (ti - time));
        document.getElementById("framerate").value = fps;
        frames = 0;
        time = ti;
    }
</script>

<br>T
<input size="2" value="30" onchange="setT( this.value )">sec
<input type="button" onclick="run()" value="Stop" size="1" id="runBtn">fps
<input size="2" id="framerate">

<br>Julia sets animation (canvas is matched to the browser window and you can change period of animation <i>T</i>). Simplified remake of the Java based
<a href="../MSet/Anim/ManJuOrbB.htm">Julia Orbit trip</a>.
<i>C</i> is moved near the main cardioid of the Mandelbrot set.

<hr><a href="webgl.htm">WebGL Demos</a>
&nbsp; &nbsp; <i>updated</i> 18 August 2010

Answer 1

你无法使用＆＃34;调试器＆＃34; glsl着色器代码中的语句。＆＃34;调试器＆＃34; statement是开发人员工具的扩展，仅在javascript中有效。

无法在断点处停下来

1 个答案: