--- title: "Context | JavaScript maps SDK" description: "Documentation for MapTiler SDK" --- > For AI agents: a documentation index is available at [/llms.txt](https://docs.maptiler.com/llms.txt). Markdown versions of all pages are available by appending .md to any URL. # Class Context ##### Index ### Constructors[](#constructors) [constructor](#constructor) ### Properties[](#properties) [activeTexture](#activetexture) [bindElementBuffer](#bindelementbuffer) [bindFramebuffer](#bindframebuffer) [bindRenderbuffer](#bindrenderbuffer) [bindTexture](#bindtexture) [bindVertexArray](#bindvertexarray) [bindVertexBuffer](#bindvertexbuffer) [blend](#blend) [blendColor](#blendcolor) [blendEquation](#blendequation) [blendFunc](#blendfunc) [clearColor](#clearcolor) [clearDepth](#cleardepth) [clearStencil](#clearstencil) [colorMask](#colormask) [cullFace](#cullface) [cullFaceSide](#cullfaceside) [currentNumAttributes](#currentnumattributes) [depthFunc](#depthfunc) [depthMask](#depthmask) [depthRange](#depthrange) [depthTest](#depthtest) [extTextureFilterAnisotropic](#exttexturefilteranisotropic) [extTextureFilterAnisotropicMax?](#exttexturefilteranisotropicmax) [frontFace](#frontface) [gl](#gl) [HALF\_FLOAT?](#half_float) [maxTextureSize](#maxtexturesize) [pixelStoreUnpack](#pixelstoreunpack) [pixelStoreUnpackFlipY](#pixelstoreunpackflipy) [pixelStoreUnpackPremultiplyAlpha](#pixelstoreunpackpremultiplyalpha) [program](#program) [RGB16F?](#rgb16f) [RGBA16F?](#rgba16f) [stencilFunc](#stencilfunc) [stencilMask](#stencilmask) [stencilOp](#stencilop) [stencilTest](#stenciltest) [viewport](#viewport) ### Methods[](#methods) [clear](#clear) [createFramebuffer](#createframebuffer) [createIndexBuffer](#createindexbuffer) [createRenderbuffer](#createrenderbuffer) [createVertexArray](#createvertexarray) [createVertexBuffer](#createvertexbuffer) [deleteVertexArray](#deletevertexarray) [setColorMode](#setcolormode) [setCullFace](#setcullface) [setDefault](#setdefault) [setDepthMode](#setdepthmode) [setDirty](#setdirty) [setStencilMode](#setstencilmode) [unbindVAO](#unbindvao) ## Constructors[](#constructors-1) ### constructor[](#constructor) - new Context(gl: [WebGLRenderingContext](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.WebGLRenderingContext/) | [WebGL2RenderingContext](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.WebGL2RenderingContext/)): Context[](#constructorcontext) #### Parameters - gl: [WebGLRenderingContext](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.WebGLRenderingContext/) | [WebGL2RenderingContext](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.WebGL2RenderingContext/) #### Returns Context ## Properties[](#properties-1) ### activeTexture[](#activetexture) activeTexture: [ActiveTextureUnit](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.ActiveTextureUnit/) ### bindElementBuffer[](#bindelementbuffer) bindElementBuffer: [BindElementBuffer](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.BindElementBuffer/) ### bindFramebuffer[](#bindframebuffer) bindFramebuffer: [BindFramebuffer](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.BindFramebuffer/) ### bindRenderbuffer[](#bindrenderbuffer) bindRenderbuffer: [BindRenderbuffer](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.BindRenderbuffer/) ### bindTexture[](#bindtexture) bindTexture: [BindTexture](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.BindTexture/) ### bindVertexArray[](#bindvertexarray) bindVertexArray: [BindVertexArray](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.BindVertexArray/) ### bindVertexBuffer[](#bindvertexbuffer) bindVertexBuffer: [BindVertexBuffer](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.BindVertexBuffer/) ### blend[](#blend) blend: [Blend](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Blend/) ### blendColor[](#blendcolor) blendColor: [BlendColor](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.BlendColor/) ### blendEquation[](#blendequation) blendEquation: [BlendEquation](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.BlendEquation/) ### blendFunc[](#blendfunc) blendFunc: [BlendFunc](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.BlendFunc/) ### clearColor[](#clearcolor) clearColor: [ClearColor](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.ClearColor/) ### clearDepth[](#cleardepth) clearDepth: [ClearDepth](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.ClearDepth/) ### clearStencil[](#clearstencil) clearStencil: [ClearStencil](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.ClearStencil/) ### colorMask[](#colormask) colorMask: [ColorMask](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.ColorMask/) ### cullFace[](#cullface) cullFace: [CullFace](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.CullFace/) ### cullFaceSide[](#cullfaceside) cullFaceSide: [CullFaceSide](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.CullFaceSide/) ### currentNumAttributes[](#currentnumattributes) currentNumAttributes: number ### depthFunc[](#depthfunc) depthFunc: [DepthFunc](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DepthFunc/) ### depthMask[](#depthmask) depthMask: [DepthMask](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DepthMask/) ### depthRange[](#depthrange) depthRange: [DepthRange](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DepthRange/) ### depthTest[](#depthtest) depthTest: [DepthTest](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DepthTest/) ### extTextureFilterAnisotropic[](#exttexturefilteranisotropic) extTextureFilterAnisotropic: [EXT\_texture\_filter\_anisotropic](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.EXT_texture_filter_anisotropic/) | null ### `Optional`extTextureFilterAnisotropicMax[](#exttexturefilteranisotropicmax) extTextureFilterAnisotropicMax?: number ### frontFace[](#frontface) frontFace: [FrontFace](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.FrontFace/) ### gl[](#gl) gl: [WebGLRenderingContext](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.WebGLRenderingContext/) | [WebGL2RenderingContext](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.WebGL2RenderingContext/) ### `Optional`HALF\_FLOAT[](#half_float) HALF\_FLOAT?: number ### maxTextureSize[](#maxtexturesize) maxTextureSize: number ### pixelStoreUnpack[](#pixelstoreunpack) pixelStoreUnpack: [PixelStoreUnpack](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.PixelStoreUnpack/) ### pixelStoreUnpackFlipY[](#pixelstoreunpackflipy) pixelStoreUnpackFlipY: [PixelStoreUnpackFlipY](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.PixelStoreUnpackFlipY/) ### pixelStoreUnpackPremultiplyAlpha[](#pixelstoreunpackpremultiplyalpha) pixelStoreUnpackPremultiplyAlpha: [PixelStoreUnpackPremultiplyAlpha](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.PixelStoreUnpackPremultiplyAlpha/) ### program[](#program) program: [ProgramValue](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.ProgramValue/) ### `Optional`RGB16F[](#rgb16f) RGB16F?: number ### `Optional`RGBA16F[](#rgba16f) RGBA16F?: number ### stencilFunc[](#stencilfunc) stencilFunc: [StencilFunc](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.StencilFunc/) ### stencilMask[](#stencilmask) stencilMask: [StencilMask](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.StencilMask/) ### stencilOp[](#stencilop) stencilOp: [StencilOp](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.StencilOp/) ### stencilTest[](#stenciltest) stencilTest: [StencilTest](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.StencilTest/) ### viewport[](#viewport) viewport: [Viewport](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Viewport/) ## Methods[](#methods-1) ### clear[](#clear) - clear(\_\_namedParameters: [ClearArgs](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.ClearArgs/)): void[](#clear-1) #### Parameters - \_\_namedParameters: [ClearArgs](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.ClearArgs/) #### Returns void ### createFramebuffer[](#createframebuffer) - createFramebuffer(     width: number,     height: number,     hasDepth: boolean,     hasStencil: boolean, ): [Framebuffer](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Framebuffer/)[](#createframebuffer-1) #### Parameters - width: number - height: number - hasDepth: boolean - hasStencil: boolean #### Returns [Framebuffer](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Framebuffer/) ### createIndexBuffer[](#createindexbuffer) - createIndexBuffer(     array: [TriangleIndexArray](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.TriangleIndexArray/) | [LineIndexArray](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.LineIndexArray/) | [LineStripIndexArray](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.LineStripIndexArray/),     dynamicDraw?: boolean, ): [IndexBuffer](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.IndexBuffer/)[](#createindexbuffer-1) #### Parameters - array: [TriangleIndexArray](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.TriangleIndexArray/) | [LineIndexArray](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.LineIndexArray/) | [LineStripIndexArray](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.LineStripIndexArray/) - `Optional`dynamicDraw: boolean #### Returns [IndexBuffer](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.IndexBuffer/) ### createRenderbuffer[](#createrenderbuffer) - createRenderbuffer(     storageFormat: number,     width: number,     height: number, ): [WebGLRenderbuffer](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.WebGLRenderbuffer/)[](#createrenderbuffer-1) #### Parameters - storageFormat: number - width: number - height: number #### Returns [WebGLRenderbuffer](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.WebGLRenderbuffer/) ### createVertexArray[](#createvertexarray) - createVertexArray(): [WebGLVertexArrayObject](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.WebGLVertexArrayObject/) | undefined[](#createvertexarray-1) #### Returns [WebGLVertexArrayObject](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.WebGLVertexArrayObject/) | undefined ### createVertexBuffer[](#createvertexbuffer) - createVertexBuffer(     array: [StructArray](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.StructArray/),     attributes: readonly [StructArrayMember](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.StructArrayMember/)\[\],     dynamicDraw?: boolean, ): [VertexBuffer](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.VertexBuffer/)[](#createvertexbuffer-1) #### Parameters - array: [StructArray](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.StructArray/) - attributes: readonly [StructArrayMember](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.StructArrayMember/)\[\] - `Optional`dynamicDraw: boolean #### Returns [VertexBuffer](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.VertexBuffer/) ### deleteVertexArray[](#deletevertexarray) - deleteVertexArray(x: [WebGLVertexArrayObject](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.WebGLVertexArrayObject/) | undefined): void[](#deletevertexarray-1) #### Parameters - x: [WebGLVertexArrayObject](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.WebGLVertexArrayObject/) | undefined #### Returns void ### setColorMode[](#setcolormode) - setColorMode(colorMode: [Readonly](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.Readonly/)<[ColorMode](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.ColorMode/)\>): void[](#setcolormode-1) #### Parameters - colorMode: [Readonly](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.Readonly/)<[ColorMode](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.ColorMode/)\> #### Returns void ### setCullFace[](#setcullface) - setCullFace(cullFaceMode: [Readonly](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.Readonly/)<[CullFaceMode](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.CullFaceMode/)\>): void[](#setcullface-1) #### Parameters - cullFaceMode: [Readonly](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.Readonly/)<[CullFaceMode](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.CullFaceMode/)\> #### Returns void ### setDefault[](#setdefault) - setDefault(): void[](#setdefault-1) #### Returns void ### setDepthMode[](#setdepthmode) - setDepthMode(depthMode: [Readonly](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.Readonly/)<[DepthMode](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DepthMode/)\>): void[](#setdepthmode-1) #### Parameters - depthMode: [Readonly](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.Readonly/)<[DepthMode](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.DepthMode/)\> #### Returns void ### setDirty[](#setdirty) - setDirty(): void[](#setdirty-1) #### Returns void ### setStencilMode[](#setstencilmode) - setStencilMode(stencilMode: [Readonly](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.Readonly/)<[StencilMode](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.StencilMode/)\>): void[](#setstencilmode-1) #### Parameters - stencilMode: [Readonly](https://docs.maptiler.com/sdk-js/api-reference/types/Externals.Readonly/)<[StencilMode](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.StencilMode/)\> #### Returns void ### unbindVAO[](#unbindvao) - unbindVAO(): void[](#unbindvao-1) #### Returns void