一，webgl 快速入门 1WebGL绘制一个点

1.在html5 页面 创建canvas  标签
         

  <!--canvas标签创建一个宽高均为500像素，背景为蓝色的矩形画布-->
    <canvas
      id="webgl"
      width="500"
      height="500"
      style="background-color: blue"
    ></canvas>

2.获取上下文

var gl =canvas.getContext('webgl') ;

说明：
        这里有多个参数 可以是 2d,webgl ,webgl2,bitmaprenderer  参数
        "2d", 建立一个 CanvasRenderingContext2D 二维渲染上下文。
        "webgl" (或"experimental-webgl") 这将创建一个 WebGLRenderingContext 三维渲染上下文对象。只在实现WebGL 版本 1(OpenGL ES 2.0) 的浏览器上可用。
        "webgl2" (或 "experimental-webgl2") 这将创建一个 WebGL2RenderingContext 三维渲染上下文对象。只在实现 WebGL 版本 2 (OpenGL ES 3.0) 的浏览器上可用。Experimental
        "bitmaprenderer" 这将创建一个只提供将 canvas 内容替换为指定ImageBitmap功能的ImageBitmapRenderingContext