1# SceneNode 2The SceneNode module provides the types and operation methods of scene nodes in 3D graphics. 3 4> **NOTE** 5> 6> The initial APIs of this module are supported since API version 12. Newly added APIs will be marked with a superscript to indicate their earliest API version. 7 8## Modules to Import 9```ts 10import { LayerMask, NodeType, Container, Node, Geometry, LightType, Light, SpotLight, DirectionalLight, 11 Camera } from '@kit.ArkGraphics3D'; 12``` 13## LayerMask 14Layer mask of a node. 15 16### getEnabled 17getEnabled(index: number): boolean 18 19Checks whether the mask is enabled for a layer of a given index. 20 21**System capability**: SystemCapability.ArkUi.Graphics3D 22 23**Parameters** 24| Name| Type| Mandatory| Description| 25| ---- | ---- | ---- | ---- | 26| index | number | Yes| Index of the layer. The value is an integer greater than or equal to 0.| 27 28**Return value** 29| Type| Description| 30| ---- | ---- | 31| boolean | **true**: The layer mask is enabled.<br>**false**: The layer mask is disabled.| 32 33**Example** 34```ts 35import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters, 36 LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D'; 37 38function layerMask() : void { 39 let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf")); 40 scene.then(async (result: Scene) => { 41 if (result) { 42 let node : Node | null = result.getNodeByPath("rootNode_"); 43 if (node) { 44 // Obtain the enabled status of the mask. 45 let enabled: Boolean = node.layerMask.getEnabled(1); 46 } 47 } 48 }); 49} 50``` 51 52### setEnabled 53 54setEnabled(index: number, enabled: boolean): void 55 56Enables the mask of a layer of a given index. 57 58**System capability**: SystemCapability.ArkUi.Graphics3D 59 60**Parameters** 61| Name| Type| Mandatory| Description| 62| ---- | ---- | ---- | ---- | 63| index | number | Yes| Index of the layer. The value is an integer greater than or equal to 0.| 64| enabled | boolean | Yes| Enabled status to set. The value **true** means to enable the layer mask, and **false** means the opposite.| 65 66**Example** 67```ts 68import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters, 69 LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D'; 70 71function layerMask() : void { 72 let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf")); 73 scene.then(async (result: Scene) => { 74 if (result) { 75 let node : Node | null = result.getNodeByPath("rootNode/Scene/"); 76 if (node) { 77 // Set the enabled status of the mask. 78 node.layerMask.setEnabled(1, true); 79 } 80 } 81 }); 82} 83``` 84 85## NodeType 86Enumerates the node types. 87 88**System capability**: SystemCapability.ArkUi.Graphics3D 89| Name| Value| Description| 90| ---- | ---- | ---- | 91| NODE | 1 | Empty node.| 92| GEOMETRY | 2 | Geometry node.| 93| CAMERA | 3 | Camera node.| 94| LIGHT | 4 | Light node.| 95 96## Container\<T> 97Container for defining scene nodes. It provides a way to group scene nodes into a hierarchy. 98 99### append 100append(item: T): void 101 102Appends a node to the container. 103 104**System capability**: SystemCapability.ArkUi.Graphics3D 105 106**Parameters** 107| Name| Type| Mandatory| Description| 108| ---- | ---- | ---- | ---- | 109| item | T | Yes| Object of the T type.| 110 111**Example** 112```ts 113import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters, 114 LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D'; 115 116function append() : void { 117 let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf")); 118 scene.then(async (result: Scene) => { 119 if (result) { 120 let node : Node | null = result.getNodeByPath("rootNode/Scene/"); 121 // Call append to add a node. 122 result.root?.children.get(0)?.children.append(node); 123 } 124 }); 125} 126``` 127 128 129### insertAfter 130insertAfter(item: T, sibling: T | null): void 131 132Inserts a node after a sibling node. 133 134**System capability**: SystemCapability.ArkUi.Graphics3D 135 136**Parameters** 137| Name| Type| Mandatory| Description| 138| ---- | ---- | ---- | ---- | 139| item | T | Yes| Node to insert.| 140| sibling | T \| null | Yes| Sibling node.| 141 142**Example** 143```ts 144import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters, 145 LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D'; 146 147function insertAfter() : void { 148 let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf")); 149 scene.then(async (result: Scene) => { 150 if (result) { 151 let node : Node | null = result.getNodeByPath("rootNode/Scene/"); 152 // Call insertAfter to add a node. 153 result.root?.children.get(0)?.children.insertAfter(node, null); 154 } 155 }); 156} 157``` 158 159### remove 160remove(item: T): void 161 162Removes a node. 163 164**System capability**: SystemCapability.ArkUi.Graphics3D 165 166**Parameters** 167| Name| Type| Mandatory| Description| 168| ---- | ---- | ---- | ---- | 169| item | T | Yes| Node to remove.| 170 171**Example** 172```ts 173import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters, 174 LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D'; 175 176function remove() : void { 177 let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf")); 178 scene.then(async (result: Scene) => { 179 if (result) { 180 let node : Node | null = result.getNodeByPath("rootNode/Scene/"); 181 // Call remove to remove a node. 182 result.root?.children.remove(node); 183 } 184 }); 185} 186``` 187 188### get 189get(index: number): T | null 190 191Obtains a node of a given index. If no node is obtained, null is returned. 192 193**System capability**: SystemCapability.ArkUi.Graphics3D 194 195**Parameters** 196| Name| Type| Mandatory| Description| 197| ---- | ---- | ---- | ---- | 198| index | number | Yes| Index of the node. The value is an integer greater than or equal to 0.| 199 200**Return value** 201| Type| Description| 202| ---- | ---- | 203| T \| null | Object obtained. If no object is obtained, null is returned.| 204 205**Example** 206```ts 207import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters, 208 LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D'; 209 210function get() : void { 211 let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf")); 212 scene.then(async (result: Scene) => { 213 if (result) { 214 let node : Node | null = result.getNodeByPath("rootNode/Scene/"); 215 // Get node 0 from children. 216 result.root?.children.get(0)?.children.insertAfter(node, null); 217 } 218 }); 219} 220``` 221 222### clear 223clear(): void 224 225Clears all nodes in the container. 226 227**System capability**: SystemCapability.ArkUi.Graphics3D 228 229**Example** 230```ts 231import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters, 232 LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D'; 233 234function clear() : void { 235 let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf")); 236 scene.then(async (result: Scene) => { 237 if (result) { 238 let node : Node | null = result.getNodeByPath("rootNode/Scene/"); 239 // Clear the nodes in children. 240 result.root?.children.clear(); 241 } 242 }); 243} 244``` 245 246### count 247count(): number 248 249Obtains the number of nodes in the container. 250 251**System capability**: SystemCapability.ArkUi.Graphics3D 252 253**Return value** 254| Type| Description| 255| ---- | ---- | 256| number | Number of nodes in the container.| 257 258**Example** 259```ts 260import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters, 261 LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D'; 262 263function count() : void { 264 let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf")); 265 scene.then(async (result: Scene) => { 266 if (result) { 267 let node : Node | null = result.getNodeByPath("rootNode_"); 268 if (node) { 269 let container: Container<Node> = node.children; 270 // Obtain the number of nodes in children. 271 let count: number = container.count(); 272 } 273 } 274 }); 275} 276``` 277 278## Node 279The 3D scene consists of nodes in a tree hierarchy, where each node implements a **Node** interface. This class inherits from [SceneResource](js-apis-inner-scene-resources.md#sceneresource). 280 281### Properties 282 283**System capability**: SystemCapability.ArkUi.Graphics3D 284 285| Name| Type| Read Only| Optional| Description| 286| ---- | ---- | ---- | ---- | ---- | 287| position | [Position3](js-apis-inner-scene-types.md#position3) | No| No| Position of the node.| 288| rotation | [Quaternion](js-apis-inner-scene-types.md#quaternion) | No| No| Rotation angle of the node.| 289| scale | [Scale3](js-apis-inner-scene-types.md#scale3) | No| No| Scale factor of the node.| 290| visible | boolean | No| No| Whether the node is visible. The value **true** means that the node is visible, and **false** means the opposite.| 291| nodeType | [NodeType](#nodetype) | Yes| No| Type of the node.| 292| layerMask | [LayerMask](#layermask) | Yes| No| Layer mask of the node.| 293| path | string | Yes| No| Path of the node.| 294| parent | [Node](#node) \| null | Yes| No| Parent node of the node. If the parent node does not exist, the value is null.| 295| children | [Container](js-apis-inner-scene-nodes.md#containert)\<[Node](#node)> | Yes| No| Children of the node. If the node does not have a child, the value is null.| 296 297### getNodeByPath 298getNodeByPath(path: string): Node | null 299 300Obtains a node by path. If no node is obtained, null is returned. 301 302**System capability**: SystemCapability.ArkUi.Graphics3D 303 304**Parameters** 305| Name| Type| Mandatory| Description| 306| ---- | ---- | ---- | ---- | 307| path | string | Yes| Path in the scene node hierarchy. Each layer is separated by a slash (/).| 308 309**Return value** 310| Type| Description| 311| ---- | ---- | 312| [Node](#node) \| null | **Node** object.| 313 314**Example** 315```ts 316import { Image, Shader, MaterialType, Material, ShaderMaterial, Animation, Environment, Container, SceneNodeParameters, 317 LightType, Light, Camera, SceneResourceParameters, SceneResourceFactory, Scene, Node } from '@kit.ArkGraphics3D'; 318 319function getNode() : void { 320 let scene: Promise<Scene> = Scene.load($rawfile("gltf/CubeWithFloor/glTF/AnimatedCube.gltf")); 321 scene.then(async (result: Scene) => { 322 if (result && result.root) { 323 // Search for a node. 324 let geo : Node | null = result.root.getNodeByPath("scene/node"); 325 } 326 }); 327} 328``` 329 330## Geometry 331Geometry node, which inherits from [Node](#node). 332 333### Properties 334 335**System capability**: SystemCapability.ArkUi.Graphics3D 336 337| Name| Type| Read Only| Optional| Description| 338| ---- | ---- | ---- | ---- | ---- | 339| mesh | [Mesh](js-apis-inner-scene-resources.md#mesh) | Yes| No| Mesh attribute.| 340 341 342## LightType 343Enumerates the light types. 344 345**System capability**: SystemCapability.ArkUi.Graphics3D 346 347| Name| Value| Description| 348| ---- | ---- | ---- | 349| DIRECTIONAL | 1 | Directional light.| 350| SPOT | 2 | Spot light.| 351 352## Light 353Light node, which inherits from [Node](#node). 354 355### Properties 356 357**System capability**: SystemCapability.ArkUi.Graphics3D 358 359| Name| Type| Read Only| Optional| Description| 360| ---- | ---- | ---- | ---- | ---- | 361| lightType | [LightType](#lighttype) | Yes| No| Light type.| 362| color | [Color](js-apis-inner-scene-types.md#color) | No| No| Color.| 363| intensity | number | No| No| Light intensity. The value is a real number greater than 0.| 364| shadowEnabled | boolean | No| No| Whether the shadow effect is enabled. The value **true** means that the shadow effect is enabled, and **false** means the opposite.| 365| enabled | boolean | No| No| Whether the light is used. The value **true** means that the light is used, and **false** means the opposite.| 366 367## SpotLight 368Spot light, which inherits from [Light](#light). 369 370**System capability**: SystemCapability.ArkUi.Graphics3D 371 372## DirectionalLight 373Directional light, which inherits from [Light](#light). 374 375**System capability**: SystemCapability.ArkUi.Graphics3D 376 377 378## Camera 379Camera node, which inherits from [Node](#node). 380 381### Properties 382 383**System capability**: SystemCapability.ArkUi.Graphics3D 384 385| Name| Type| Read Only| Optional| Description| 386| ---- | ---- | ---- | ---- | ---- | 387| fov | number | No| No| Field of view. The value ranges from 0 to π radians.| 388| nearPlane | number | No| No| Near plane. The value is greater than 0.| 389| farPlane | number | No| No| Remote plane. The value must be greater than that of **nearPlane**.| 390| enabled | boolean | No| No| Whether the camera is enabled. The value **true** means that the camera is enabled, and **false** means the opposite.| 391| postProcess | [PostProcessSettings](js-apis-inner-scene-post-process-settings.md#postprocesssettings) \| null | No| No| Post-processing settings.| 392| clearColor | [Color](js-apis-inner-scene-types.md#color) \| null | No| No| Color after the render target is cleared.| 393