[图片]

工程是使用小游戏的第一个创建模板，纯gl模式，在game,在game.js的测试代码如下 // 请求动画帧兼容性处理 if (!wx.requestAnimationFrame) {   wx.requestAnimationFrame = function (callback) {     setTimeout(callback, 1000 / 60);   }; } // 创建画布 const canvas = wx.createCanvas(); const gl = canvas.getContext("webgl") || canvas.getContext("experimental-webgl"); // 顶点着色器源代码 const vertexShaderSource = ` attribute vec4 a_position; void main() {   gl_Position = a_position; } `; // 片段着色器源代码 const fragmentShaderSource = ` precision mediump float; void main() {   gl_FragColor = vec4(1, 0, 0, 1); } `; // 创建、编译和检查顶点着色器 const vertexShader = gl.createShader(gl.VERTEX_SHADER); gl.shaderSource(vertexShader, vertexShaderSource); gl.compileShader(vertexShader); if (!gl.getShaderParameter(vertexShader, gl.COMPILE_STATUS)) {   console.error("Vertex shader compilation failed: ", gl.getShaderInfoLog(vertexShader)); } // 创建、编译和检查片段着色器 const fragmentShader = gl.createShader(gl.FRAGMENT_SHADER); gl.shaderSource(fragmentShader, fragmentShaderSource); gl.compileShader(fragmentShader); if (!gl.getShaderParameter(fragmentShader, gl.COMPILE_STATUS)) {   console.error("Fragment shader compilation failed: ", gl.getShaderInfoLog(fragmentShader)); } // 创建着色器程序并附加着色器 const shaderProgram = gl.createProgram(); gl.attachShader(shaderProgram, vertexShader); gl.attachShader(shaderProgram, fragmentShader); gl.linkProgram(shaderProgram); if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) {   console.error("Program linking failed: ", gl.getProgramInfoLog(shaderProgram)); } // 使用着色器程序 gl.useProgram(shaderProgram); // 设置清除颜色和视口 gl.clearColor(0, 0, 0, 1); gl.viewport(0, 0, canvas.width, canvas.height); // 创建包含顶点数据的缓冲区 const vertexBuffer = gl.createBuffer(); gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer); const vertices = new Float32Array([   -0.5, -0.5,    0.5, -0.5,   -0.5,  0.5,    0.5,  0.5 ]); gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW); // 获取顶点着色器中 a_position 属性的位置 const a_position = gl.getAttribLocation(shaderProgram, "a_position"); // 启用顶点属性数组 gl.enableVertexAttribArray(a_position); // 将缓冲区绑定到 a_position 属性 gl.vertexAttribPointer(a_position, 2, gl.FLOAT, false, 0, 0); // 绘制场景的函数 function drawScene() {   // 清除颜色缓冲区   gl.clear(gl.COLOR_BUFFER_BIT);   // 绘制三角形   gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);   // 请求下一帧   wx.requestAnimationFrame(drawScene);   console.log('drawScene'); } // 开始绘制 drawScene(); 以上是测试代码，写在game.js中，game.json内容如下 {     "deviceOrientation": "portrait",     "renderMode": "webgl" } ，渲染模拟机截图，真机表现一样。[图片]