Skip to main content

Class: State

渲染状态管理,目的是减少CPU与GPU的交互,一般我们不需要主动创建,它默认包含在 Renderer 实例中。

Hierarchy​

  • default

    ↳ State

Constructors​

constructor​

• new State(renderer, options?): State

Parameters​

NameType
rendererRenderer
options?Partial<StateOptions>

Returns​

State

Overrides​

Base.constructor

Defined in​

src/core/State.ts:113

Properties​

renderer​

• renderer: Renderer

Inherited from​

Base.renderer

Defined in​

src/core/Base.ts:7

Accessors​

gl​

• get gl(): WebGLRenderingContext | WebGL2RenderingContext

获取 webgl 实例

Returns​

WebGLRenderingContext | WebGL2RenderingContext

Inherited from​

Base.gl

Defined in​

src/core/Base.ts:16


rendererState​

• get rendererState(): State

获取渲染状态

Returns​

State

Inherited from​

Base.rendererState

Defined in​

src/core/Base.ts:23


state​

• get state(): IState

获取所有状态

Returns​

IState

Defined in​

src/core/State.ts:162


viewport​

• get viewport(): Object

获取视图

Returns​

Object

NameType
xnumber
ynumber
widthnumber
heightnumber

Defined in​

src/core/State.ts:169


textureUnits​

• get textureUnits(): (string | number)[]

获取当前 gl 的纹理单位

Returns​

(string | number)[]

Defined in​

src/core/State.ts:176


activeTextureUnit​

• get activeTextureUnit(): number

获取已激活的纹理

Returns​

number

Defined in​

src/core/State.ts:183

• set activeTextureUnit(activeTextureUnit): void

设置当前激活的纹理

Parameters​

NameType
activeTextureUnitnumber

Returns​

void

Defined in​

src/core/State.ts:191


currentProgramId​

• get currentProgramId(): string | number

获取当前的 Program id

Returns​

string | number

Defined in​

src/core/State.ts:198

• set currentProgramId(id): void

设置当前的 Program id

Parameters​

NameType
idstring | number

Returns​

void

Defined in​

src/core/State.ts:206


activeGeometryId​

• get activeGeometryId(): string | number

获取当前激活的几何体 id

Returns​

string | number

Defined in​

src/core/State.ts:213

• set activeGeometryId(id): void

设置当前激活的几何体 id

Parameters​

NameType
idstring | number

Returns​

void

Defined in​

src/core/State.ts:221


flipY​

• get flipY(): boolean

获取 flipY 配置

Returns​

boolean

Defined in​

src/core/State.ts:236

• set flipY(flipY): void

设置 flipY

Parameters​

NameType
flipYboolean

Returns​

void

Defined in​

src/core/State.ts:229


unpackAlignment​

• get unpackAlignment(): number

获取 unpackAlignment 配置

Returns​

number

Defined in​

src/core/State.ts:251

• set unpackAlignment(unpackAlignment): void

设置 unpackAlignment

Parameters​

NameType
unpackAlignmentnumber

Returns​

void

Defined in​

src/core/State.ts:244


premultiplyAlpha​

• get premultiplyAlpha(): boolean

获取 premultipliedAlpha 配置

Returns​

boolean

Defined in​

src/core/State.ts:266

• set premultiplyAlpha(premultiplyAlpha): void

设置 premultipliedAlpha

Parameters​

NameType
premultiplyAlphaboolean

Returns​

void

Defined in​

src/core/State.ts:259


boundBuffer​

• get boundBuffer(): null | WebGLBuffer

获取最后一次绑定的顶点数据

Returns​

null | WebGLBuffer

Defined in​

src/core/State.ts:281

• set boundBuffer(boundBuffer): void

设置最后一次绑定的顶点数据

Parameters​

NameType
boundBuffernull | WebGLBuffer

Returns​

void

Defined in​

src/core/State.ts:274


anisotropy​

• get anisotropy(): number

获取 anisotropy 配置

Returns​

number

Defined in​

src/core/State.ts:296

• set anisotropy(anisotropy): void

配置 anisotropy

Parameters​

NameType
anisotropynumber

Returns​

void

Defined in​

src/core/State.ts:289

Methods​

apply​

▸ apply(options): void

apply options 并且更新状态

Parameters​

NameType
optionsPartial<StateOptions>

Returns​

void

Defined in​

src/core/State.ts:304


enable​

▸ enable(id): void

开启诸如 DEPTH_TEST、BLEND 等功能

Parameters​

NameType
idany

Returns​

void

Defined in​

src/core/State.ts:357


disable​

▸ disable(id): void

关闭诸如 DEPTH_TEST、BLEND 等功能

Parameters​

NameType
idany

Returns​

void

Defined in​

src/core/State.ts:368


setViewport​

▸ setViewport(width, height, x?, y?): void

设置 Viewport

Parameters​

NameTypeDefault value
widthanyundefined
heightanyundefined
xnumber0
ynumber0

Returns​

void

Defined in​

src/core/State.ts:382


setMask​

▸ setMask(colorMask): void

设置颜色缓冲的状态 模板缓冲可以实现渲染剔除,需要遮罩的话,可能希望只绘制模板缓冲而不绘制颜色缓冲 gl.colorMask(false, false, false, false):关闭颜色缓冲的所有通道 gl.colorMask(true, true, true, true):开启颜色缓冲的所有通道

Parameters​

NameType
colorMaskboolean

Returns​

void

Defined in​

src/core/State.ts:400


setBlending​

▸ setBlending(blending, options?): void

指定渲染时的颜色混合方式 https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/blendFunc

Parameters​

NameType
blendingBlendType
options?Partial<StateOptions>

Returns​

void

Defined in​

src/core/State.ts:413


setBlendFunc​

▸ setBlendFunc(src, dst, srcAlpha?, dstAlpha?): void

设置混合方式

Parameters​

NameType
srcnumber
dstnumber
srcAlpha?number
dstAlpha?number

Returns​

void

Defined in​

src/core/State.ts:490


setBlendEquation​

▸ setBlendEquation(modeRGB, modeAlpha?): void

设置 blendEquation gl.FUNC_ADD:相加处理 gl.FUNC_SUBTRACT:相减处理 gl.FUNC_REVERSE_SUBSTRACT:反向相减处理,即 dest 减去 source

Parameters​

NameType
modeRGBnumber
modeAlpha?number

Returns​

void

Defined in​

src/core/State.ts:520


setClearAlpha​

▸ setClearAlpha(alpha): void

设置当前 State 下的清屏的透明度

Parameters​

NameType
alphanumber

Returns​

void

Defined in​

src/core/State.ts:542


setClearColor​

▸ setClearColor(color, alpha?): void

设置清屏颜色和透明度值

Parameters​

NameTypeDescription
colorColorLike颜色
alpha?number透明度

Returns​

void

Defined in​

src/core/State.ts:553


setCullFace​

▸ setCullFace(cullFace): void

设置背面剔除方式

Parameters​

NameType
cullFacenumber

Returns​

void

Defined in​

src/core/State.ts:569


setFrontFace​

▸ setFrontFace(frontFace): void

设置正面三角形顶点顺序 绘制立体图形时会使用三角形的顶点顺序来决定三角形的面是否朝向观察者,背向观察者的三角形一般不进行光栅化处理,绘制时会被剔除

Parameters​

NameType
frontFacenumber

Returns​

void

Defined in​

src/core/State.ts:587


setDepthMask​

▸ setDepthMask(mask): void

设置深度缓冲区的写入操作方式(只读或者可写)

Parameters​

NameType
maskboolean

Returns​

void

Defined in​

src/core/State.ts:598


setDepthFunc​

▸ setDepthFunc(func): void

指定将输入像素深度与当前深度缓冲区值进行比较的函数

Parameters​

NameType
funcnumber

Returns​

void

Defined in​

src/core/State.ts:609


setDepthTest​

▸ setDepthTest(state): void

设置是否开启深度测试

Parameters​

NameType
stateboolean

Returns​

void

Defined in​

src/core/State.ts:620


setStencilFunc​

▸ setStencilFunc(cmp, ref, mask, face?): void

设置模板缓冲测试方式

Parameters​

NameTypeDescription
cmpnumber指定比较方式
refnumber用来做stencil测试的参考值
masknumber指定操作掩码,在测试的时候会先将ref与mask进行与运算
face?number

Returns​

void

Defined in​

src/core/State.ts:638


setStencilOp​

▸ setStencilOp(fail, zFail, zPass, face?): undefined | boolean

设置模板测试的操作

Parameters​

NameTypeDescription
failany指定模板测试失败时要使用的操作。默认值为 gl.KEEP
zFailany指定模板测试通过但深度测试失败时要使用的操作。默认值为 gl.KEEP
zPassany指定当模板测试和深度测试都通过时使用的操作,或者当模板测试通过但没有深度缓冲区或深度测试被禁用时使用的操作。默认值为 gl.KEEP
face?number

Returns​

undefined | boolean

Defined in​

src/core/State.ts:670


setStencilMask​

▸ setStencilMask(mask, face?): void

设置模版测试的操作掩码

Parameters​

NameType
maskany
face?number

Returns​

void

Defined in​

src/core/State.ts:743


setActiveTexture​

▸ setActiveTexture(unit): void

设置当前激活的纹理单位

Parameters​

NameType
unitany

Returns​

void

Defined in​

src/core/State.ts:761


setLineWidth​

▸ setLineWidth(width): void

设置 webgl 的线宽(注意大部分浏览器下是有 BUG 的)

Parameters​

NameType
widthany

Returns​

void

Defined in​

src/core/State.ts:772


setPolygonOffset​

▸ setPolygonOffset(polygonOffset, factor, units): void

设置深度值的偏移量,主要可以用于解决当几何图形或物体的两个表面非常接近时会出现的深度冲突(Z fighting)。 原因是因为两个表面过于接近,深度缓冲区有限的精度无法区分哪个在前哪个在后。

gl.polygonOffset(factor, units)方法指定加到每个顶点绘制后Z值上的偏移量, 偏移量按照公式 m*factor+r*units 计算,其中m表示顶点所在表面相对于观察者的视线的角度, 而r表示硬件能够区分两个Z值之差的最小值

Parameters​

NameType
polygonOffsetany
factorany
unitsany

Returns​

void

Defined in​

src/core/State.ts:790


bindFramebuffer​

▸ bindFramebuffer(v?): void

绑定或者解绑 FBO

Parameters​

NameType
vFBOData

Returns​

void

Defined in​

src/core/State.ts:808


setActiveGeometry​

▸ setActiveGeometry(id): void

设置当前激活的 Geometry

Parameters​

NameType
idany

Returns​

void

Defined in​

src/core/State.ts:820


reset​

▸ reset(force?): void

重置 State

Parameters​

NameTypeDefault value
forcebooleantrue

Returns​

void

Defined in​

src/core/State.ts:828