1. Web
  2. Web API
  3. WebGLProgram

WebGLProgram

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

* Some parts of this feature may have varying levels of support.

Note: This feature is available in Web Workers.

WebGLProgram là một phần của WebGL API và là sự kết hợp của hai WebGLShader đã được biên dịch, bao gồm vertex shader và fragment shader (cả hai đều được viết bằng GLSL).

WebGLObject WebGLProgram

Để tạo một WebGLProgram, hãy gọi hàm createProgram() của ngữ cảnh GL. Sau khi gắn các shader bằng attachShader(), bạn liên kết chúng thành một chương trình có thể sử dụng. Điều này được minh họa trong đoạn mã dưới đây.

js
const program = gl.createProgram();

// Attach pre-existing shaders
gl.attachShader(program, vertexShader);
gl.attachShader(program, fragmentShader);

gl.linkProgram(program);

if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
  const info = gl.getProgramInfoLog(program);
  throw new Error(`Could not compile WebGL program. \n\n${info}`);
}

Xem WebGLShader để biết thông tin về cách tạo vertexShader và fragmentShader trong ví dụ trên.

Ví dụ

Sử dụng chương trình

Các bước để thực sự thực hiện một số công việc với chương trình bao gồm yêu cầu GPU sử dụng chương trình, liên kết dữ liệu và các tùy chọn cấu hình phù hợp, và cuối cùng vẽ ra màn hình.

js
// Use the program
gl.useProgram(program);

// Bind existing attribute data
gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
gl.enableVertexAttribArray(attributeLocation);
gl.vertexAttribPointer(attributeLocation, 3, gl.FLOAT, false, 0, 0);

// Draw a single triangle
gl.drawArrays(gl.TRIANGLES, 0, 3);

Xóa chương trình

Nếu có lỗi khi liên kết chương trình hoặc bạn muốn xóa một chương trình hiện có, thì chỉ cần chạy WebGLRenderingContext.deleteProgram(). Thao tác này giải phóng bộ nhớ của chương trình đã liên kết.

js
gl.deleteProgram(program);

Thông số kỹ thuật

Specification
WebGL Specification
# 5.6

Tương thích trình duyệt

Xem thêm

Help improve MDN

Learn how to contribute

This page was last modified on by MDN contributors.

View this page on GitHub • Report a problem with this content