收藏
回答

小游戏webgl画个红色的点,模拟器可以显示,iphone无法显示?

// let ctx = canvas.getContext('webgl', {
//   antialias: true,
//   preserveDrawingBuffer: true
// });
let ctx = canvas.getContext('webgl')
// 确认WebGL支持性
if (!ctx) {
  wx.showToast({
    title: "无法初始化WebGL,你的浏览器、操作系统或硬件等可能不支持WebGL。",
    icon: 'success',
    duration: 2000
  })
}
/**
 * 游戏主函数
 */
export default class Main3d {
  constructor() {
    this.restart()
  }
  restart() {
    // 告诉WebGL怎样把提供的gl_Position裁剪空间坐标对应到画布像素坐标(屏幕空间)
     ctx.viewport(00, ctx.canvas.width, ctx.canvas.height);
   
    // 使用完全不透明的黑色清除所有图像
    ctx.clearColor(0.00.00.01.0);
    // 用上面指定的颜色清除缓冲区
    ctx.clear(ctx.COLOR_BUFFER_BIT);
    this.draw1Point()
  }
  draw1Point() {
    //顶点着色器程序
    var VSHADER_SOURCE =
      "void main() {" +
      //设置坐标
      "gl_Position = vec4(0.0, 0.0, 0.0, 1.0); " +
      //设置尺寸
      "gl_PointSize = 10.0; " +
      "} ";
    //片元着色器
    var FSHADER_SOURCE =
      "void main() {" +
      //设置颜色
      "gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);" +
      "}";
    //编译着色器
    var vertShader = ctx.createShader(ctx.VERTEX_SHADER);
    ctx.shaderSource(vertShader, VSHADER_SOURCE);
    ctx.compileShader(vertShader);

    var fragShader = ctx.createShader(ctx.FRAGMENT_SHADER);
    ctx.shaderSource(fragShader, FSHADER_SOURCE);
    ctx.compileShader(fragShader);
    //合并程序
    var shaderProgram = ctx.createProgram();
    ctx.attachShader(shaderProgram, vertShader);
    ctx.attachShader(shaderProgram, fragShader);
    ctx.linkProgram(shaderProgram);
    ctx.useProgram(shaderProgram);
    //绘制一个点
    ctx.drawArrays(ctx.POINTS, 01);
  }
}
回答关注问题邀请回答
收藏

1 个回答

  • 小游戏运营专员-宏
    小游戏运营专员-宏
    10-09

    参考下此贴回复: https://developers.weixin.qq.com/community/develop/doc/000a2a62450c20e50aba8a15a56400

    10-09
    有用
    回复 2
    • 赵召
      赵召
      10-09
      10-09
      回复
    • 猫先生
      猫先生
      10-10回复赵召
      参考该帖子,主要var vertexBuffer = gl.createBuffer();那几行~
      对比一下,帖子楼主的代码和回答的代码~
      10-10
      回复
登录 后发表内容
问题标签