engine/docs/en/graphics/renderer/renderer.md

order, title, type, group, label

order	title	type	group	label
0	Renderer Overview	Graphics	Renderer	Graphics/Renderer

The renderer is responsible for displaying graphics as a component. It displays the corresponding rendering effects based on different data sources. By mounting the renderer on a node and setting the corresponding rendering data, various complex 3D scenes can be displayed.

Types of Renderers

In Galacean, the following types of renderers are built-in:

• Mesh Renderer: Renders objects by setting mesh and material.
• Skinned Mesh Renderer: Based on the Mesh Renderer, it additionally includes capabilities for skeletal animation and Blend Shape, making the animation effects of objects more natural.
• Sprite Renderer: By setting sprite and material (default built-in sprite material), 2D images can be displayed in the scene.
• Sprite Mask Renderer: Used to implement masking effects for the sprite renderer.
• Text Renderer: Displays text in the scene.
• Particle Renderer: Displays particle effects in the scene.

You can learn more about the rendering order of various renderers in the engine through Rendering Order.

Properties

Renderer is the base class for all renderers in Galacean, and it includes the following properties:

Property	Description
receiveShadows	Whether to receive shadows
castShadows	Whether to cast shadows
priority	The rendering priority of the renderer, the smaller the value, the higher the priority, default is 0
shaderData	Data dependent on rendering, including some constants and macro switches
materialCount	Total number of materials contained in the renderer
bounds	World bounding box of the renderer
isCulled	Whether the renderer is rendered in the current frame

You can get these properties from any renderer derived from Renderer.

const renderer = cubeEntity.getComponent(Renderer);
renderer.castShadows = true;
renderer.receiveShadows = true;
renderer.priority = 1;
console.log("shaderData", renderer.shaderData);
console.log("materialCount", renderer.materialCount);
console.log("bounds", renderer.bounds);
console.log("isCulled", renderer.isCulled);

Below shows how to get the overall bounding box of multiple Renderers:

Methods

The Renderer base class mainly provides methods for setting and getting materials. It is important to note that a renderer may contain multiple materials, so the following methods are more like manipulating an array of materials.

Method	Description
setMaterial	Sets a material in the array
getMaterial	Gets a material from the array
getMaterials	Gets the array of materials
getInstanceMaterial	Gets a copy of a material from the array
getInstanceMaterials	Gets copies of the array of materials