@aidinabedi/playcanvas

<!doctype html> <html lang="en"> <head> <title>pc.Material | PlayCanvas API Reference</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="icon" type="image/png" href="images/playcanvas-favicon.png"> <link href="styles/styles.css" rel="stylesheet"> <link href="styles/playcanvas-theme.css" rel="stylesheet"> <script src="scripts/interface.js"></script> <script src="scripts/highlight.min.js"></script> <script>hljs.initHighlightingOnLoad();</script> </head> <body> <header> <nav class="header-width"> <a href="/" class="header-title"><img src="images/playcanvas-manual.png"></a> <ul class="header-menu"> <li class="user-manual"><a href="https://developer.playcanvas.com/en/user-manual/">User Manual</a></li> <li class="tutorials"><a href="https://developer.playcanvas.com/en/tutorials">Tutorials</a></li> <li class="forum"><a href="https://forum.playcanvas.com/" target="_blank">Forum</a></li> <li class="api active"><a href="/api/">API Reference</a></li> </ul> </nav> <div class="header-content header-page header-width"> <h1><span class="font-icon"></span>API Reference</h1> <input id="search" class="search" type="text" placeholder="Search"></input> </div> </header> <div class="container content-width"> <nav class="sidebar"> <div class="sidebarFilter"> <input id="filter-input" type="text" placeholder="Filter"> </div> <ul> <li id="nav-pc"><a href="pc.html">pc</a></li> <li id="nav-pc.callbacks"><a href="pc.callbacks.html">pc.callbacks</a></li> <li id="nav-pc.guid"><a href="pc.guid.html">pc.guid</a></li> <li id="nav-pc.math"><a href="pc.math.html">pc.math</a></li> <li id="nav-pc.path"><a href="pc.path.html">pc.path</a></li> <li id="nav-pc.platform"><a href="pc.platform.html">pc.platform</a></li> <li id="nav-pc.script"><a href="pc.script.html">pc.script</a></li> <li id="nav-pc.string"><a href="pc.string.html">pc.string</a></li> <li id="nav-pc.Animation"><a href="pc.Animation.html">Animation</a></li> <li id="nav-pc.AnimationComponent"><a href="pc.AnimationComponent.html">AnimationComponent</a></li> <li id="nav-pc.AnimationComponentSystem"><a href="pc.AnimationComponentSystem.html">AnimationComponentSystem</a></li> <li id="nav-pc.AnimationHandler"><a href="pc.AnimationHandler.html">AnimationHandler</a></li> <li id="nav-pc.AnimCache"><a href="pc.AnimCache.html">AnimCache</a></li> <li id="nav-pc.AnimClip"><a href="pc.AnimClip.html">AnimClip</a></li> <li id="nav-pc.AnimController"><a href="pc.AnimController.html">AnimController</a></li> <li id="nav-pc.AnimCurve"><a href="pc.AnimCurve.html">AnimCurve</a></li> <li id="nav-pc.AnimData"><a href="pc.AnimData.html">AnimData</a></li> <li id="nav-pc.AnimSnapshot"><a href="pc.AnimSnapshot.html">AnimSnapshot</a></li> <li id="nav-pc.AnimTarget"><a href="pc.AnimTarget.html">AnimTarget</a></li> <li id="nav-pc.AnimTrack"><a href="pc.AnimTrack.html">AnimTrack</a></li> <li id="nav-pc.Application"><a href="pc.Application.html">Application</a></li> <li id="nav-pc.Asset"><a href="pc.Asset.html">Asset</a></li> <li id="nav-pc.AssetReference"><a href="pc.AssetReference.html">AssetReference</a></li> <li id="nav-pc.AssetRegistry"><a href="pc.AssetRegistry.html">AssetRegistry</a></li> <li id="nav-pc.AudioHandler"><a href="pc.AudioHandler.html">AudioHandler</a></li> <li id="nav-pc.AudioListenerComponent"><a href="pc.AudioListenerComponent.html">AudioListenerComponent</a></li> <li id="nav-pc.AudioListenerComponentSystem"><a href="pc.AudioListenerComponentSystem.html">AudioListenerComponentSystem</a></li> <li id="nav-pc.BasicMaterial"><a href="pc.BasicMaterial.html">BasicMaterial</a></li> <li id="nav-pc.Batch"><a href="pc.Batch.html">Batch</a></li> <li id="nav-pc.BatchGroup"><a href="pc.BatchGroup.html">BatchGroup</a></li> <li id="nav-pc.BatchManager"><a href="pc.BatchManager.html">BatchManager</a></li> <li id="nav-pc.BoundingBox"><a href="pc.BoundingBox.html">BoundingBox</a></li> <li id="nav-pc.BoundingSphere"><a href="pc.BoundingSphere.html">BoundingSphere</a></li> <li id="nav-pc.ButtonComponent"><a href="pc.ButtonComponent.html">ButtonComponent</a></li> <li id="nav-pc.ButtonComponentSystem"><a href="pc.ButtonComponentSystem.html">ButtonComponentSystem</a></li> <li id="nav-pc.CameraComponent"><a href="pc.CameraComponent.html">CameraComponent</a></li> <li id="nav-pc.CameraComponentSystem"><a href="pc.CameraComponentSystem.html">CameraComponentSystem</a></li> <li id="nav-pc.CollisionComponent"><a href="pc.CollisionComponent.html">CollisionComponent</a></li> <li id="nav-pc.CollisionComponentSystem"><a href="pc.CollisionComponentSystem.html">CollisionComponentSystem</a></li> <li id="nav-pc.Color"><a href="pc.Color.html">Color</a></li> <li id="nav-pc.Component"><a href="pc.Component.html">Component</a></li> <li id="nav-pc.ComponentSystem"><a href="pc.ComponentSystem.html">ComponentSystem</a></li> <li id="nav-pc.ComponentSystemRegistry"><a href="pc.ComponentSystemRegistry.html">ComponentSystemRegistry</a></li> <li id="nav-pc.ContactPoint"><a href="pc.ContactPoint.html">ContactPoint</a></li> <li id="nav-pc.ContactResult"><a href="pc.ContactResult.html">ContactResult</a></li> <li id="nav-pc.ContainerHandler"><a href="pc.ContainerHandler.html">ContainerHandler</a></li> <li id="nav-pc.ContainerResource"><a href="pc.ContainerResource.html">ContainerResource</a></li> <li id="nav-pc.Controller"><a href="pc.Controller.html">Controller</a></li> <li id="nav-pc.CubemapHandler"><a href="pc.CubemapHandler.html">CubemapHandler</a></li> <li id="nav-pc.Curve"><a href="pc.Curve.html">Curve</a></li> <li id="nav-pc.CurveSet"><a href="pc.CurveSet.html">CurveSet</a></li> <li id="nav-pc.ElementComponent"><a href="pc.ElementComponent.html">ElementComponent</a></li> <li id="nav-pc.ElementComponentSystem"><a href="pc.ElementComponentSystem.html">ElementComponentSystem</a></li> <li id="nav-pc.ElementDragHelper"><a href="pc.ElementDragHelper.html">ElementDragHelper</a></li> <li id="nav-pc.ElementInput"><a href="pc.ElementInput.html">ElementInput</a></li> <li id="nav-pc.ElementInputEvent"><a href="pc.ElementInputEvent.html">ElementInputEvent</a></li> <li id="nav-pc.ElementMouseEvent"><a href="pc.ElementMouseEvent.html">ElementMouseEvent</a></li> <li id="nav-pc.ElementTouchEvent"><a href="pc.ElementTouchEvent.html">ElementTouchEvent</a></li> <li id="nav-pc.Entity"><a href="pc.Entity.html">Entity</a></li> <li id="nav-pc.EventHandler"><a href="pc.EventHandler.html">EventHandler</a></li> <li id="nav-pc.Font"><a href="pc.Font.html">Font</a></li> <li id="nav-pc.FontHandler"><a href="pc.FontHandler.html">FontHandler</a></li> <li id="nav-pc.ForwardRenderer"><a href="pc.ForwardRenderer.html">ForwardRenderer</a></li> <li id="nav-pc.Frustum"><a href="pc.Frustum.html">Frustum</a></li> <li id="nav-pc.GamePads"><a href="pc.GamePads.html">GamePads</a></li> <li id="nav-pc.GraphicsDevice"><a href="pc.GraphicsDevice.html">GraphicsDevice</a></li> <li id="nav-pc.GraphNode"><a href="pc.GraphNode.html">GraphNode</a></li> <li id="nav-pc.Http"><a href="pc.Http.html">Http</a></li> <li id="nav-pc.I18n"><a href="pc.I18n.html">I18n</a></li> <li id="nav-pc.IndexBuffer"><a href="pc.IndexBuffer.html">IndexBuffer</a></li> <li id="nav-pc.Keyboard"><a href="pc.Keyboard.html">Keyboard</a></li> <li id="nav-pc.KeyboardEvent"><a href="pc.KeyboardEvent.html">KeyboardEvent</a></li> <li id="nav-pc.Layer"><a href="pc.Layer.html">Layer</a></li> <li id="nav-pc.LayerComposition"><a href="pc.LayerComposition.html">LayerComposition</a></li> <li id="nav-pc.LayoutChildComponent"><a href="pc.LayoutChildComponent.html">LayoutChildComponent</a></li> <li id="nav-pc.LayoutChildComponentSystem"><a href="pc.LayoutChildComponentSystem.html">LayoutChildComponentSystem</a></li> <li id="nav-pc.LayoutGroupComponent"><a href="pc.LayoutGroupComponent.html">LayoutGroupComponent</a></li> <li id="nav-pc.LayoutGroupComponentSystem"><a href="pc.LayoutGroupComponentSystem.html">LayoutGroupComponentSystem</a></li> <li id="nav-pc.LightComponent"><a href="pc.LightComponent.html">LightComponent</a></li> <li id="nav-pc.LightComponentSystem"><a href="pc.LightComponentSystem.html">LightComponentSystem</a></li> <li id="nav-pc.Lightmapper"><a href="pc.Lightmapper.html">Lightmapper</a></li> <li id="nav-pc.Mat3"><a href="pc.Mat3.html">Mat3</a></li> <li id="nav-pc.Mat4"><a href="pc.Mat4.html">Mat4</a></li> <li id="nav-pc.Material"><a href="pc.Material.html">Material</a></li> <li id="nav-pc.MaterialHandler"><a href="pc.MaterialHandler.html">MaterialHandler</a></li> <li id="nav-pc.Mesh"><a href="pc.Mesh.html">Mesh</a></li> <li id="nav-pc.MeshInstance"><a href="pc.MeshInstance.html">MeshInstance</a></li> <li id="nav-pc.Model"><a href="pc.Model.html">Model</a></li> <li id="nav-pc.ModelComponent"><a href="pc.ModelComponent.html">ModelComponent</a></li> <li id="nav-pc.ModelComponentSystem"><a href="pc.ModelComponentSystem.html">ModelComponentSystem</a></li> <li id="nav-pc.ModelHandler"><a href="pc.ModelHandler.html">ModelHandler</a></li> <li id="nav-pc.Morph"><a href="pc.Morph.html">Morph</a></li> <li id="nav-pc.MorphInstance"><a href="pc.MorphInstance.html">MorphInstance</a></li> <li id="nav-pc.MorphTarget"><a href="pc.MorphTarget.html">MorphTarget</a></li> <li id="nav-pc.Mouse"><a href="pc.Mouse.html">Mouse</a></li> <li id="nav-pc.MouseEvent"><a href="pc.MouseEvent.html">MouseEvent</a></li> <li id="nav-pc.Node"><a href="pc.Node.html">Node</a></li> <li id="nav-pc.OrientedBox"><a href="pc.OrientedBox.html">OrientedBox</a></li> <li id="nav-pc.ParticleSystemComponent"><a href="pc.ParticleSystemComponent.html">ParticleSystemComponent</a></li> <li id="nav-pc.ParticleSystemComponentSystem"><a href="pc.ParticleSystemComponentSystem.html">ParticleSystemComponentSystem</a></li> <li id="nav-pc.Picker"><a href="pc.Picker.html">Picker</a></li> <li id="nav-pc.PostEffect"><a href="pc.PostEffect.html">PostEffect</a></li> <li id="nav-pc.PostEffectQueue"><a href="pc.PostEffectQueue.html">PostEffectQueue</a></li> <li id="nav-pc.Quat"><a href="pc.Quat.html">Quat</a></li> <li id="nav-pc.Ray"><a href="pc.Ray.html">Ray</a></li> <li id="nav-pc.RaycastResult"><a href="pc.RaycastResult.html">RaycastResult</a></li> <li id="nav-pc.RenderTarget"><a href="pc.RenderTarget.html">RenderTarget</a></li> <li id="nav-pc.ResourceHandler"><a href="pc.ResourceHandler.html">ResourceHandler</a></li> <li id="nav-pc.ResourceLoader"><a href="pc.ResourceLoader.html">ResourceLoader</a></li> <li id="nav-pc.RigidBodyComponent"><a href="pc.RigidBodyComponent.html">RigidBodyComponent</a></li> <li id="nav-pc.RigidBodyComponentSystem"><a href="pc.RigidBodyComponentSystem.html">RigidBodyComponentSystem</a></li> <li id="nav-pc.Scene"><a href="pc.Scene.html">Scene</a></li> <li id="nav-pc.SceneHandler"><a href="pc.SceneHandler.html">SceneHandler</a></li> <li id="nav-pc.ScopeId"><a href="pc.ScopeId.html">ScopeId</a></li> <li id="nav-pc.ScopeSpace"><a href="pc.ScopeSpace.html">ScopeSpace</a></li> <li id="nav-pc.ScreenComponent"><a href="pc.ScreenComponent.html">ScreenComponent</a></li> <li id="nav-pc.ScreenComponentSystem"><a href="pc.ScreenComponentSystem.html">ScreenComponentSystem</a></li> <li id="nav-pc.ScriptAttributes"><a href="pc.ScriptAttributes.html">ScriptAttributes</a></li> <li id="nav-pc.ScriptComponent"><a href="pc.ScriptComponent.html">ScriptComponent</a></li> <li id="nav-pc.ScriptComponentSystem"><a href="pc.ScriptComponentSystem.html">ScriptComponentSystem</a></li> <li id="nav-pc.ScriptHandler"><a href="pc.ScriptHandler.html">ScriptHandler</a></li> <li id="nav-pc.ScriptRegistry"><a href="pc.ScriptRegistry.html">ScriptRegistry</a></li> <li id="nav-pc.ScriptType"><a href="pc.ScriptType.html">ScriptType</a></li> <li id="nav-pc.ScrollbarComponent"><a href="pc.ScrollbarComponent.html">ScrollbarComponent</a></li> <li id="nav-pc.ScrollbarComponentSystem"><a href="pc.ScrollbarComponentSystem.html">ScrollbarComponentSystem</a></li> <li id="nav-pc.ScrollViewComponent"><a href="pc.ScrollViewComponent.html">ScrollViewComponent</a></li> <li id="nav-pc.ScrollViewComponentSystem"><a href="pc.ScrollViewComponentSystem.html">ScrollViewComponentSystem</a></li> <li id="nav-pc.Shader"><a href="pc.Shader.html">Shader</a></li> <li id="nav-pc.SingleContactResult"><a href="pc.SingleContactResult.html">SingleContactResult</a></li> <li id="nav-pc.Skeleton"><a href="pc.Skeleton.html">Skeleton</a></li> <li id="nav-pc.Skin"><a href="pc.Skin.html">Skin</a></li> <li id="nav-pc.SkinInstance"><a href="pc.SkinInstance.html">SkinInstance</a></li> <li id="nav-pc.Sound"><a href="pc.Sound.html">Sound</a></li> <li id="nav-pc.SoundComponent"><a href="pc.SoundComponent.html">SoundComponent</a></li> <li id="nav-pc.SoundComponentSystem"><a href="pc.SoundComponentSystem.html">SoundComponentSystem</a></li> <li id="nav-pc.SoundInstance"><a href="pc.SoundInstance.html">SoundInstance</a></li> <li id="nav-pc.SoundInstance3d"><a href="pc.SoundInstance3d.html">SoundInstance3d</a></li> <li id="nav-pc.SoundManager"><a href="pc.SoundManager.html">SoundManager</a></li> <li id="nav-pc.SoundSlot"><a href="pc.SoundSlot.html">SoundSlot</a></li> <li id="nav-pc.Sprite"><a href="pc.Sprite.html">Sprite</a></li> <li id="nav-pc.SpriteAnimationClip"><a href="pc.SpriteAnimationClip.html">SpriteAnimationClip</a></li> <li id="nav-pc.SpriteComponent"><a href="pc.SpriteComponent.html">SpriteComponent</a></li> <li id="nav-pc.SpriteComponentSystem"><a href="pc.SpriteComponentSystem.html">SpriteComponentSystem</a></li> <li id="nav-pc.SpriteHandler"><a href="pc.SpriteHandler.html">SpriteHandler</a></li> <li id="nav-pc.StandardMaterial"><a href="pc.StandardMaterial.html">StandardMaterial</a></li> <li id="nav-pc.StencilParameters"><a href="pc.StencilParameters.html">StencilParameters</a></li> <li id="nav-pc.Tags"><a href="pc.Tags.html">Tags</a></li> <li id="nav-pc.Texture"><a href="pc.Texture.html">Texture</a></li> <li id="nav-pc.TextureAtlas"><a href="pc.TextureAtlas.html">TextureAtlas</a></li> <li id="nav-pc.TextureAtlasHandler"><a href="pc.TextureAtlasHandler.html">TextureAtlasHandler</a></li> <li id="nav-pc.TextureHandler"><a href="pc.TextureHandler.html">TextureHandler</a></li> <li id="nav-pc.Touch"><a href="pc.Touch.html">Touch</a></li> <li id="nav-pc.TouchDevice"><a href="pc.TouchDevice.html">TouchDevice</a></li> <li id="nav-pc.TouchEvent"><a href="pc.TouchEvent.html">TouchEvent</a></li> <li id="nav-pc.TransformFeedback"><a href="pc.TransformFeedback.html">TransformFeedback</a></li> <li id="nav-pc.Vec2"><a href="pc.Vec2.html">Vec2</a></li> <li id="nav-pc.Vec3"><a href="pc.Vec3.html">Vec3</a></li> <li id="nav-pc.Vec4"><a href="pc.Vec4.html">Vec4</a></li> <li id="nav-pc.VertexAttributeDescription"><a href="pc.VertexAttributeDescription.html">VertexAttributeDescription</a></li> <li id="nav-pc.VertexAttributeElement"><a href="pc.VertexAttributeElement.html">VertexAttributeElement</a></li> <li id="nav-pc.VertexBuffer"><a href="pc.VertexBuffer.html">VertexBuffer</a></li> <li id="nav-pc.VertexFormat"><a href="pc.VertexFormat.html">VertexFormat</a></li> <li id="nav-pc.VertexIterator"><a href="pc.VertexIterator.html">VertexIterator</a></li> <li id="nav-pc.VertexIteratorAccessor"><a href="pc.VertexIteratorAccessor.html">VertexIteratorAccessor</a></li> <li id="nav-pc.XrInput"><a href="pc.XrInput.html">XrInput</a></li> <li id="nav-pc.XrInputSource"><a href="pc.XrInputSource.html">XrInputSource</a></li> <li id="nav-pc.XrManager"><a href="pc.XrManager.html">XrManager</a></li> </ul> </nav> <div class='sidebarToggle'><span></span>Class List</div> <main class="cls"> <h1>pc.Material</h1> <p><p>A material determines how a particular mesh instance is rendered. It specifies the shader and render state that is set before the mesh instance is submitted to the graphics device.</p></p>  <h1>Summary</h1>     <h3>Properties</h3> <table class="properties"> <tr> <td><a href="#alphaTest">alphaTest</a></td><td><p>The alpha test reference value to control which fragments are written to the currently active render target based on alpha value.</td> </tr> <tr> <td><a href="#alphaToCoverage">alphaToCoverage</a></td><td><p>Enables or disables alpha to coverage (WebGL2 only).</td> </tr> <tr> <td><a href="#alphaWrite">alphaWrite</a></td><td><p>If true, the alpha component of fragments generated by the shader of this material is written to the color buffer of the currently active render target.</td> </tr> <tr> <td><a href="#blendType">blendType</a></td><td><p>Controls how primitives are blended when being written to the currently active render target.</td> </tr> <tr> <td><a href="#blueWrite">blueWrite</a></td><td><p>If true, the blue component of fragments generated by the shader of this material is written to the color buffer of the currently active render target.</td> </tr> <tr> <td><a href="#cull">cull</a></td><td><p>Controls how triangles are culled based on their face direction with respect to the viewpoint.</td> </tr> <tr> <td><a href="#depthBias">depthBias</a></td><td><p>Offsets the output depth buffer value.</td> </tr> <tr> <td><a href="#depthTest">depthTest</a></td><td><p>If true, fragments generated by the shader of this material are only written to the current render target if they pass the depth test.</td> </tr> <tr> <td><a href="#depthWrite">depthWrite</a></td><td><p>If true, fragments generated by the shader of this material write a depth value to the depth buffer of the currently active render target.</td> </tr> <tr> <td><a href="#greenWrite">greenWrite</a></td><td><p>If true, the green component of fragments generated by the shader of this material is written to the color buffer of the currently active render target.</td> </tr> <tr> <td><a href="#name">name</a></td><td><p>The name of the material.</td> </tr> <tr> <td><a href="#redWrite">redWrite</a></td><td><p>If true, the red component of fragments generated by the shader of this material is written to the color buffer of the currently active render target.</td> </tr> <tr> <td><a href="#shader">shader</a></td><td><p>The shader used by this material to render mesh instances (default is null).</td> </tr> <tr> <td><a href="#slopeDepthBias">slopeDepthBias</a></td><td><p>Same as pc.Material#depthBias, but also depends on the slope of the triangle relative to the camera.</td> </tr> <tr> <td><a href="#stencilBack">stencilBack</a></td><td><p>Stencil parameters for back faces (default is null).</td> </tr> <tr> <td><a href="#stencilFront">stencilFront</a></td><td><p>Stencil parameters for front faces (default is null).</td> </tr> </table>  <h3>Methods</h3> <table class="properties"> <tr> <td><a href="#deleteParameter">deleteParameter</a></td><td><p>Deletes a shader parameter on a material.</td> </tr> <tr> <td><a href="#destroy">destroy</a></td><td><p>Removes this material from the scene and possibly frees up memory from its shaders (if there are no other materials using it).</td> </tr> <tr> <td><a href="#getParameter">getParameter</a></td><td><p>Retrieves the specified shader parameter from a material.</td> </tr> <tr> <td><a href="#setParameter">setParameter</a></td><td><p>Sets a shader parameter on a material.</td> </tr> <tr> <td><a href="#setParameters">setParameters</a></td><td><p>Pushes all material parameters into scope.</td> </tr> <tr> <td><a href="#update">update</a></td><td><p>Applies any changes made to the material's properties.</td> </tr> </table>  <h1>Details</h1>    <h2>Constructor</h2>  <div id="Material"> <h3 class="methodname">Material() <a class="font-icon" href="#Material"></a></h3> <p><p>Create a new Material instance.</p></p> </div>  <h2>Properties</h2> <div id="alphaTest"> <span class="property"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number">number</a></span><span class="property">alphaTest <a class="font-icon" href="#alphaTest"></a></span> <p><p>The alpha test reference value to control which fragments are written to the currently active render target based on alpha value. All fragments with an alpha value of less than the alphaTest reference value will be discarded. alphaTest defaults to 0 (all fragments pass).</p></p> </div> <div id="alphaToCoverage"> <span class="property"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span><span class="property">alphaToCoverage <a class="font-icon" href="#alphaToCoverage"></a></span> <p><p>Enables or disables alpha to coverage (WebGL2 only). When enabled, and if hardware anti-aliasing is on, limited order-independent transparency can be achieved. Quality depends on the number of MSAA samples of the current render target. It can nicely soften edges of otherwise sharp alpha cutouts, but isn't recommended for large area semi-transparent surfaces. Note, that you don't need to enable blending to make alpha to coverage work. It will work without it, just like alphaTest.</p></p> </div> <div id="alphaWrite"> <span class="property"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span><span class="property">alphaWrite <a class="font-icon" href="#alphaWrite"></a></span> <p><p>If true, the alpha component of fragments generated by the shader of this material is written to the color buffer of the currently active render target. If false, the alpha component will not be written. Defaults to true.</p></p> </div> <div id="blendType"> <span class="property"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number">number</a></span><span class="property">blendType <a class="font-icon" href="#blendType"></a></span> <p><p>Controls how primitives are blended when being written to the currently active render target. Can be:</p> <ul> <li><a href="pc.html#BLEND_SUBTRACTIVE">pc.BLEND_SUBTRACTIVE</a>: Subtract the color of the source fragment from the destination fragment and write the result to the frame buffer.</li> <li><a href="pc.html#BLEND_ADDITIVE">pc.BLEND_ADDITIVE</a>: Add the color of the source fragment to the destination fragment and write the result to the frame buffer.</li> <li><a href="pc.html#BLEND_NORMAL">pc.BLEND_NORMAL</a>: Enable simple translucency for materials such as glass. This is equivalent to enabling a source blend mode of pc.BLENDMODE_SRC_ALPHA and a destination blend mode of pc.BLENDMODE_ONE_MINUS_SRC_ALPHA.</li> <li><a href="pc.html#BLEND_NONE">pc.BLEND_NONE</a>: Disable blending.</li> <li><a href="pc.html#BLEND_PREMULTIPLIED">pc.BLEND_PREMULTIPLIED</a>: Similar to pc.BLEND_NORMAL expect the source fragment is assumed to have already been multiplied by the source alpha value.</li> <li><a href="pc.html#BLEND_MULTIPLICATIVE">pc.BLEND_MULTIPLICATIVE</a>: Multiply the color of the source fragment by the color of the destination fragment and write the result to the frame buffer.</li> <li><a href="pc.html#BLEND_ADDITIVEALPHA">pc.BLEND_ADDITIVEALPHA</a>: Same as pc.BLEND_ADDITIVE except the source RGB is multiplied by the source alpha.</li> </ul> <p>Defaults to pc.BLEND_NONE.</p></p> </div> <div id="blueWrite"> <span class="property"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span><span class="property">blueWrite <a class="font-icon" href="#blueWrite"></a></span> <p><p>If true, the blue component of fragments generated by the shader of this material is written to the color buffer of the currently active render target. If false, the blue component will not be written. Defaults to true.</p></p> </div> <div id="cull"> <span class="property"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number">number</a></span><span class="property">cull <a class="font-icon" href="#cull"></a></span> <p><p>Controls how triangles are culled based on their face direction with respect to the viewpoint. Can be:</p> <ul> <li><a href="pc.html#CULLFACE_NONE">pc.CULLFACE_NONE</a>: Do not cull triangles based on face direction.</li> <li><a href="pc.html#CULLFACE_BACK">pc.CULLFACE_BACK</a>: Cull the back faces of triangles (do not render triangles facing away from the view point).</li> <li><a href="pc.html#CULLFACE_FRONT">pc.CULLFACE_FRONT</a>: Cull the front faces of triangles (do not render triangles facing towards the view point).</li> <li><a href="pc.html#CULLFACE_FRONTANDBACK">pc.CULLFACE_FRONTANDBACK</a>: Cull both front and back faces (triangles will not be rendered).</li> </ul> <p>Defaults to pc.CULLFACE_BACK.</p></p> </div> <div id="depthBias"> <span class="property"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number">number</a></span><span class="property">depthBias <a class="font-icon" href="#depthBias"></a></span> <p><p>Offsets the output depth buffer value. Useful for decals to prevent z-fighting.</p></p> </div> <div id="depthTest"> <span class="property"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span><span class="property">depthTest <a class="font-icon" href="#depthTest"></a></span> <p><p>If true, fragments generated by the shader of this material are only written to the current render target if they pass the depth test. If false, fragments generated by the shader of this material are written to the current render target regardless of what is in the depth buffer. Defaults to true.</p></p> </div> <div id="depthWrite"> <span class="property"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span><span class="property">depthWrite <a class="font-icon" href="#depthWrite"></a></span> <p><p>If true, fragments generated by the shader of this material write a depth value to the depth buffer of the currently active render target. If false, no depth value is written. Defaults to true.</p></p> </div> <div id="greenWrite"> <span class="property"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span><span class="property">greenWrite <a class="font-icon" href="#greenWrite"></a></span> <p><p>If true, the green component of fragments generated by the shader of this material is written to the color buffer of the currently active render target. If false, the green component will not be written. Defaults to true.</p></p> </div> <div id="name"> <span class="property"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></span><span class="property">name <a class="font-icon" href="#name"></a></span> <p><p>The name of the material.</p></p> </div> <div id="redWrite"> <span class="property"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean">boolean</a></span><span class="property">redWrite <a class="font-icon" href="#redWrite"></a></span> <p><p>If true, the red component of fragments generated by the shader of this material is written to the color buffer of the currently active render target. If false, the red component will not be written. Defaults to true.</p></p> </div> <div id="shader"> <span class="property"><a href="pc.Shader.html">pc.Shader</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Null">null</a></span><span class="property">shader <a class="font-icon" href="#shader"></a></span> <p><p>The shader used by this material to render mesh instances (default is null).</p></p> </div> <div id="slopeDepthBias"> <span class="property"><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number">number</a></span><span class="property">slopeDepthBias <a class="font-icon" href="#slopeDepthBias"></a></span> <p><p>Same as pc.Material#depthBias, but also depends on the slope of the triangle relative to the camera.</p></p> </div> <div id="stencilBack"> <span class="property"><a href="pc.StencilParameters.html">pc.StencilParameters</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Null">null</a></span><span class="property">stencilBack <a class="font-icon" href="#stencilBack"></a></span> <p><p>Stencil parameters for back faces (default is null).</p></p> </div> <div id="stencilFront"> <span class="property"><a href="pc.StencilParameters.html">pc.StencilParameters</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Null">null</a></span><span class="property">stencilFront <a class="font-icon" href="#stencilFront"></a></span> <p><p>Stencil parameters for front faces (default is null).</p></p> </div>  <h2>Methods</h2> <div id="deleteParameter"> <h3 class="methodname">deleteParameter(name) <a class="font-icon" href="#deleteParameter"></a></h3> <p><p>Deletes a shader parameter on a material.</p></p> <h4>Parameters</h4> <table> <tr> <td>name</td><td><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></td><td><p>The name of the parameter to delete.</p></td> </tr> </table> </div> <div id="destroy"> <h3 class="methodname">destroy() <a class="font-icon" href="#destroy"></a></h3> <p><p>Removes this material from the scene and possibly frees up memory from its shaders (if there are no other materials using it).</p></p> </div> <div id="getParameter"> <h3 class="methodname">getParameter(name) <a class="font-icon" href="#getParameter"></a></h3> <p><p>Retrieves the specified shader parameter from a material.</p></p> <h4>Parameters</h4> <table> <tr> <td>name</td><td><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></td><td><p>The name of the parameter to query.</p></td> </tr> </table> <h4>Returns</h4> <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object">object</a> <p>The named parameter.</p> </div> <div id="setParameter"> <h3 class="methodname">setParameter(name, data, [passFlags]) <a class="font-icon" href="#setParameter"></a></h3> <p><p>Sets a shader parameter on a material.</p></p> <h4>Parameters</h4> <table> <tr> <td>name</td><td><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String">string</a></td><td><p>The name of the parameter to set.</p></td> </tr> <tr> <td>data</td><td><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number">number</a>, <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number">number[]</a>, <a href="pc.Texture.html">pc.Texture</a></td><td><p>The value for the specified parameter.</p></td> </tr> <tr> <td>passFlags</td><td><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number">number</a></td><td><p>Mask describing which passes the material should be included in.</p></td> </tr> </table> </div> <div id="setParameters"> <h3 class="methodname">setParameters() <a class="font-icon" href="#setParameters"></a></h3> <p><p>Pushes all material parameters into scope.</p></p> </div> <div id="update"> <h3 class="methodname">update() <a class="font-icon" href="#update"></a></h3> <p><p>Applies any changes made to the material's properties.</p></p> </div>  </main> </div> </body> </html>