update docs against 6193

Signed-off-by: Nwusongqing <wusongqing@huawei.com>

en/application-dev/webgl/webgl-guidelines.md

@@ -12,17 +12,17 @@ WebGL helps you process graphics at the frontend, for example, drawing color gra
 | API| Description|
 | -------- | -------- |
 | canvas.getContext | Obtains the canvas context.|
-| webgl.createBuffer(): WebGLBuffer \| null | Creates and initializes a WebGL buffer.|
-| webgl.bindBuffer(target: GLenum, buffer: WebGLBuffer \| null): void | Binds the WebGL buffer to the target.|
-| webgl.bufferData(target: GLenum, srcData: ArrayBufferView, usage: GLenum, srcOffset: GLuint, length?: GLuint): void | Creates and initializes the WebGL buffer object's data store.|
-| webgl.getAttribLocation(program: WebGLProgram, name: string): GLint | Obtains the address of the **attribute** variable in the shader from the given WebGLProgram.|
-| webgl.vertexAttribPointer(index: GLuint, size: GLint, type: GLenum, normalized: GLboolean, stride: GLsizei, offset: GLintptr): void | Assigns a **Buffer** object to a variable.|
-| webgl.enableVertexAttribArray(index: GLuint): void | Connects a variable to the **Buffer** object allocated to it.|
-| webgl.clearColor(red:&nbsp;GLclampf,&nbsp;green:&nbsp;GLclampf,&nbsp;blue:&nbsp;GLclampf,&nbsp;alpha:&nbsp;GLclampf):&nbsp;void | Clears the specified color on the **\<canvas>** component.|
-| webgl.clear(mask:&nbsp;GLbitfield):&nbsp;void | Clears the **\<canvas>** component.|
-| webgl.drawArrays(mode:&nbsp;GLenum,&nbsp;first:&nbsp;GLint,&nbsp;count:&nbsp;GLsizei):&nbsp;void | Draws data.|
-| webgl.flush():&nbsp;void | Flushes data to the GPU and clears the buffer.|
-| webgl.createProgram():&nbsp;WebGLProgram&nbsp;\|&nbsp;null | Creates a **WebGLProgram** object.|
+| webgl.createBuffer(): WebGLBuffer \| null | Creates and initializes a WebGL buffer.|
+| webgl.bindBuffer(target: GLenum, buffer: WebGLBuffer \| null): void | Binds the WebGL buffer to the target.|
+| webgl.bufferData(target: GLenum, srcData: ArrayBufferView, usage: GLenum, srcOffset: GLuint, length?: GLuint): void | Creates and initializes the WebGL buffer object's data store.|
+| webgl.getAttribLocation(program: WebGLProgram, name: string): GLint | Obtains the address of the **attribute** variable in the shader from the given WebGLProgram.|
+| webgl.vertexAttribPointer(index GLuint, size: GLint, type: GLenum, normalized: GLboolean, stride: GLsizei, offset: GLintptr): void | Assigns a **Buffer** object to a variable.|
+| webgl.enableVertexAttribArray(index: GLuint): void | Connects a variable to the **Buffer** object allocated to it.|
+| webgl.clearColor(red: GLclampf, green:GLclampf, blue: GLclampf, alpha: GLclampf): void | Clears the specified color on the **\<canvas>** component.|
+| webgl.clear(mask: GLbitfield): void | Clears the **\<canvas>** component.|
+| webgl.drawArrays(mode: GLenum, first:;GLint, count: GLsizei): void | Draws data.|
+| webgl.flush(): void | Flushes data to the GPU and clears the buffer.|
+| webgl.createProgram(): WebGLProgram \| null | Creates a **WebGLProgram** object.|
 
 
 ## How to Develop
@@ -699,3 +699,9 @@ To use WebGL to draw a color triangle (GPU drawing), perform the following steps
 **Figure 2** Effect of clicking the button to draw a color triangle
 
 ![en-us_image_0000001192429306](figures/en-us_image_0000001192429306.gif)
+
+## Samples
+
+The following sample is provided to help you better understand how to develop WebGL:
+
+- [`JsWbgGL`: WebGL (JS, API version 8)](https://gitee.com/openharmony/app_samples/tree/master/Graphics/JsWebGL)