The Entity is the core primitive of a PlayCanvas game. Generally speaking an object in your game will consist of an Entity, and a set of Components which are managed by their respective ComponentSystems. One of those components maybe a ScriptComponent which allows you to write custom code to attach to your Entity.

The Entity uniquely identifies the object and also provides a transform for position and orientation which it inherits from GraphNode so can be added into the scene graph. The Component and ComponentSystem provide the logic to give an Entity a specific type of behavior. e.g. the ability to render a model or play a sound. Components are specific to an instance of an Entity and are attached (e.g. this.entity.model) ComponentSystems allow access to all Entities and Components and are attached to the AppBase.

Hierarchy (View Summary)

Constructors

  • Create a new Entity.

    Parameters

    • Optionalname: string

      The non-unique name of the entity, default is "Untitled".

    • Optionalapp: AppBase = ...

      The application the entity belongs to, default is the current application.

    Returns Entity

    const entity = new pc.Entity();

    // Add a Component to the Entity
    entity.addComponent("camera", {
    fov: 45,
    nearClip: 1,
    farClip: 10000
    });

    // Add the Entity into the scene graph
    app.root.addChild(entity);

    // Move the entity
    entity.translate(10, 0, 0);

    // Or translate it by setting its position directly
    const p = entity.getPosition();
    entity.setPosition(p.x + 10, p.y, p.z);

    // Change the entity's rotation in local space
    const e = entity.getLocalEulerAngles();
    entity.setLocalEulerAngles(e.x, e.y + 90, e.z);

    // Or use rotateLocal
    entity.rotateLocal(0, 90, 0);

Properties

Gets the AnimComponent attached to this entity.

Gets the AnimationComponent attached to this entity.

audiolistener: AudioListenerComponent

Gets the AudioListenerComponent attached to this entity.

Gets the ButtonComponent attached to this entity.

Gets the CameraComponent attached to this entity.

Gets the CollisionComponent attached to this entity.

Gets the ElementComponent attached to this entity.

Gets the GSplatComponent attached to this entity.

Gets the LayoutChildComponent attached to this entity.

Gets the LayoutGroupComponent attached to this entity.

Gets the LightComponent attached to this entity.

Gets the ModelComponent attached to this entity.

name: string

The non-unique name of a graph node. Defaults to 'Untitled'.

particlesystem: ParticleSystemComponent

Gets the ParticleSystemComponent attached to this entity.

Gets the RenderComponent attached to this entity.

Gets the RigidBodyComponent attached to this entity.

Gets the ScreenComponent attached to this entity.

Gets the ScriptComponent attached to this entity.

Gets the ScrollbarComponent attached to this entity.

Gets the ScrollViewComponent attached to this entity.

Gets the SoundComponent attached to this entity.

Gets the SpriteComponent attached to this entity.

tags: Tags = ...

Interface for tagging graph nodes. Tag based searches can be performed using the GraphNode#findByTag function.

Accessors

  • get enabled(): boolean
  • Gets the enabled state of the GraphNode.

    Returns boolean

  • set enabled(enabled: boolean): void
  • Sets the enabled state of the GraphNode. If one of the GraphNode's parents is disabled there will be no other side effects. If all the parents are enabled then the new value will activate or deactivate all the enabled children of the GraphNode.

    Parameters

    • enabled: boolean

    Returns void

  • get graphDepth(): number
  • Gets the depth of this child within the graph. Note that for performance reasons this is only recalculated when a node is added to a new parent. In other words, it is not recalculated when a node is simply removed from the graph.

    Returns number

Methods

  • Create a deep copy of the Entity. Duplicate the full Entity hierarchy, with all Components and all descendants. Note, this Entity is not in the hierarchy and must be added manually.

    Returns Entity

    A new Entity which is a deep copy of the original.

    const e = this.entity.clone();

    // Add clone as a sibling to the original
    this.entity.parent.addChild(e);
  • Destroy the entity and all of its descendants. First, all of the entity's components are disabled and then removed. Then, the entity is removed from the hierarchy. This is then repeated recursively for all descendants of the entity.

    The last thing the entity does is fire the destroy event.

    Returns void

    const firstChild = this.entity.children[0];
    firstChild.destroy(); // destroy child and all of its descendants
  • Search the graph node and all of its descendants for the nodes that satisfy some search criteria.

    Parameters

    • attr: string | FindNodeCallback

      This can either be a function or a string. If it's a function, it is executed for each descendant node to test if node satisfies the search logic. Returning true from the function will include the node into the results. If it's a string then it represents the name of a field or a method of the node. If this is the name of a field then the value passed as the second argument will be checked for equality. If this is the name of a function then the return value of the function will be checked for equality against the valued passed as the second argument to this function.

    • Optionalvalue: any

      If the first argument (attr) is a property name then this value will be checked against the value of the property.

    Returns GraphNode[]

    The array of graph nodes that match the search criteria.

    // Finds all nodes that have a model component and have 'door' in their lower-cased name
    const doors = house.find(function (node) {
    return node.model && node.name.toLowerCase().indexOf('door') !== -1;
    });
    // Finds all nodes that have the name property set to 'Test'
    const entities = parent.find('name', 'Test');
  • Get the first node found in the graph by its full path in the graph. The full path has this form 'parent/child/sub-child'. The search is depth first.

    Parameters

    • path: string | string[]

      The full path of the GraphNode as either a string or array of GraphNode names.

    Returns GraphNode

    The first node to be found matching the supplied path. Returns null if no node is found.

    // String form
    const grandchild = this.entity.findByPath('child/grandchild');
    // Array form
    const grandchild = this.entity.findByPath(['child', 'grandchild']);
  • Return all graph nodes that satisfy the search query. Query can be simply a string, or comma separated strings, to have inclusive results of assets that match at least one query. A query that consists of an array of tags can be used to match graph nodes that have each tag of array.

    Parameters

    • ...args: any

    Returns GraphNode[]

    A list of all graph nodes that match the query.

    // Return all graph nodes that tagged by `animal`
    const animals = node.findByTag("animal");
    // Return all graph nodes that tagged by `bird` OR `mammal`
    const birdsAndMammals = node.findByTag("bird", "mammal");
    // Return all assets that tagged by `carnivore` AND `mammal`
    const meatEatingMammals = node.findByTag(["carnivore", "mammal"]);
    // Return all assets that tagged by (`carnivore` AND `mammal`) OR (`carnivore` AND `reptile`)
    const meatEatingMammalsAndReptiles = node.findByTag(["carnivore", "mammal"], ["carnivore", "reptile"]);
  • Search the entity and all of its descendants for the first component of specified type.

    Parameters

    • type: string

      The name of the component type to retrieve.

    Returns Component

    A component of specified type, if the entity or any of its descendants has one. Returns undefined otherwise.

    // Get the first found light component in the hierarchy tree that starts with this entity
    const light = entity.findComponent("light");
  • Search the entity and all of its descendants for all components of specified type.

    Parameters

    • type: string

      The name of the component type to retrieve.

    Returns Component[]

    All components of specified type in the entity or any of its descendants. Returns empty array if none found.

    // Get all light components in the hierarchy tree that starts with this entity
    const lights = entity.findComponents("light");
  • Search the graph node and all of its descendants for the first node that satisfies some search criteria.

    Parameters

    • attr: string | FindNodeCallback

      This can either be a function or a string. If it's a function, it is executed for each descendant node to test if node satisfies the search logic. Returning true from the function will result in that node being returned from findOne. If it's a string then it represents the name of a field or a method of the node. If this is the name of a field then the value passed as the second argument will be checked for equality. If this is the name of a function then the return value of the function will be checked for equality against the valued passed as the second argument to this function.

    • Optionalvalue: any

      If the first argument (attr) is a property name then this value will be checked against the value of the property.

    Returns GraphNode

    A graph node that match the search criteria. Returns null if no node is found.

    // Find the first node that is called 'head' and has a model component
    const head = player.findOne(function (node) {
    return node.model && node.name === 'head';
    });
    // Finds the first node that has the name property set to 'Test'
    const node = parent.findOne('name', 'Test');
  • Search the entity and all of its descendants for the first script instance of specified type.

    Parameters

    Returns ScriptType

    A script instance of specified type, if the entity or any of its descendants has one. Returns undefined otherwise.

    // Get the first found "playerController" instance in the hierarchy tree that starts with this entity
    var controller = entity.findScript("playerController");
  • Search the entity and all of its descendants for all script instances of specified type.

    Parameters

    Returns ScriptType[]

    All script instances of specified type in the entity or any of its descendants. Returns empty array if none found.

    // Get all "playerController" instances in the hierarchy tree that starts with this entity
    var controllers = entity.findScripts("playerController");
  • Fire an event, all additional arguments are passed on to the event listener.

    Parameters

    • name: string

      Name of event to fire.

    • Optionalarg1: any

      First argument that is passed to the event handler.

    • Optionalarg2: any

      Second argument that is passed to the event handler.

    • Optionalarg3: any

      Third argument that is passed to the event handler.

    • Optionalarg4: any

      Fourth argument that is passed to the event handler.

    • Optionalarg5: any

      Fifth argument that is passed to the event handler.

    • Optionalarg6: any

      Sixth argument that is passed to the event handler.

    • Optionalarg7: any

      Seventh argument that is passed to the event handler.

    • Optionalarg8: any

      Eighth argument that is passed to the event handler.

    Returns EventHandler

    Self for chaining.

    obj.fire('test', 'This is the message');
    
  • Executes a provided function once on this graph node and all of its descendants.

    Parameters

    • callback: ForEachNodeCallback

      The function to execute on the graph node and each descendant.

    • OptionalthisArg: object

      Optional value to use as this when executing callback function.

    Returns void

    // Log the path and name of each node in descendant tree starting with "parent"
    parent.forEach(function (node) {
    console.log(node.path + "/" + node.name);
    });
  • Get the world space rotation for the specified GraphNode in Euler angle form. The rotation is returned as euler angles in a Vec3. The value returned by this function should be considered read-only. In order to set the world space rotation of the graph node, use GraphNode#setEulerAngles.

    Returns Vec3

    The world space rotation of the graph node in Euler angle form.

    const angles = this.entity.getEulerAngles();
    angles.y = 180; // rotate the entity around Y by 180 degrees
    this.entity.setEulerAngles(angles);
  • Get the world space position for the specified GraphNode. The position is returned as a Vec3. The value returned by this function should be considered read-only. In order to set the world space position of the graph node, use GraphNode#setPosition.

    Returns Vec3

    The world space position of the graph node.

    const position = this.entity.getPosition();
    position.x = 10;
    this.entity.setPosition(position);
  • Test if there are any handlers bound to an event name.

    Parameters

    • name: string

      The name of the event to test.

    Returns boolean

    True if the object has handlers bound to the specified event name.

    obj.on('test', function () { }); // bind an event to 'test'
    obj.hasEvent('test'); // returns true
    obj.hasEvent('hello'); // returns false
  • Insert a new child to the child list at the specified index and update the parent value of the child node. If the node already had a parent, it is removed from its child list.

    Parameters

    • node: GraphNode

      The new child to insert.

    • index: number

      The index in the child list of the parent where the new node will be inserted.

    Returns void

    const e = new pc.Entity(app);
    this.entity.insertChild(e, 1);
  • Reorients the graph node so that the negative z-axis points towards the target. This function has two valid signatures. Either pass 3D vectors for the look at coordinate and up vector, or pass numbers to represent the vectors.

    Parameters

    • x: number | Vec3

      If passing a 3D vector, this is the world space coordinate to look at. Otherwise, it is the x-component of the world space coordinate to look at.

    • Optionaly: number | Vec3

      If passing a 3D vector, this is the world space up vector for look at transform. Otherwise, it is the y-component of the world space coordinate to look at.

    • Optionalz: number

      Z-component of the world space coordinate to look at.

    • Optionalux: number = 0

      X-component of the up vector for the look at transform. Defaults to 0.

    • Optionaluy: number = 1

      Y-component of the up vector for the look at transform. Defaults to 1.

    • Optionaluz: number = 0

      Z-component of the up vector for the look at transform. Defaults to 0.

    Returns void

    // Look at another entity, using the (default) positive y-axis for up
    const position = otherEntity.getPosition();
    this.entity.lookAt(position);
    // Look at another entity, using the negative world y-axis for up
    const position = otherEntity.getPosition();
    this.entity.lookAt(position, pc.Vec3.DOWN);
    // Look at the world space origin, using the (default) positive y-axis for up
    this.entity.lookAt(0, 0, 0);
    // Look at world space coordinate [10, 10, 10], using the negative world y-axis for up
    this.entity.lookAt(10, 10, 10, 0, -1, 0);
  • Detach an event handler from an event. If callback is not provided then all callbacks are unbound from the event, if scope is not provided then all events with the callback will be unbound.

    Parameters

    • Optionalname: string

      Name of the event to unbind.

    • Optionalcallback: HandleEventCallback

      Function to be unbound.

    • Optionalscope: object

      Scope that was used as the this when the event is fired.

    Returns EventHandler

    Self for chaining.

    const handler = function () {
    };
    obj.on('test', handler);

    obj.off(); // Removes all events
    obj.off('test'); // Removes all events called 'test'
    obj.off('test', handler); // Removes all handler functions, called 'test'
    obj.off('test', handler, this); // Removes all handler functions, called 'test' with scope this
  • Attach an event handler to an event.

    Parameters

    • name: string

      Name of the event to bind the callback to.

    • callback: HandleEventCallback

      Function that is called when event is fired. Note the callback is limited to 8 arguments.

    • Optionalscope: object = ...

      Object to use as 'this' when the event is fired, defaults to current this.

    Returns EventHandle

    Can be used for removing event in the future.

    obj.on('test', function (a, b) {
    console.log(a + b);
    });
    obj.fire('test', 1, 2); // prints 3 to the console
    const evt = obj.on('test', function (a, b) {
    console.log(a + b);
    });
    // some time later
    evt.off();
  • Attach an event handler to an event. This handler will be removed after being fired once.

    Parameters

    • name: string

      Name of the event to bind the callback to.

    • callback: HandleEventCallback

      Function that is called when event is fired. Note the callback is limited to 8 arguments.

    • Optionalscope: object = ...

      Object to use as 'this' when the event is fired, defaults to current this.

    Returns EventHandle

    • can be used for removing event in the future.
    obj.once('test', function (a, b) {
    console.log(a + b);
    });
    obj.fire('test', 1, 2); // prints 3 to the console
    obj.fire('test', 1, 2); // not going to get handled
  • Remove a component from the Entity.

    Parameters

    • type: string

      The name of the Component type.

    Returns void

    const entity = new pc.Entity();
    entity.addComponent("light"); // add new light component

    entity.removeComponent("light"); // remove light component
  • Rotates the graph node in world space by the specified Euler angles. Eulers are specified in degrees in XYZ order. This function has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the world space rotation.

    Parameters

    • x: number | Vec3

      3-dimensional vector holding world space rotation or rotation around world space x-axis in degrees.

    • Optionaly: number

      Rotation around world space y-axis in degrees.

    • Optionalz: number

      Rotation around world space z-axis in degrees.

    Returns void

    // Rotate via 3 numbers
    this.entity.rotate(0, 90, 0);
    // Rotate via vector
    const r = new pc.Vec3(0, 90, 0);
    this.entity.rotate(r);
  • Rotates the graph node in local space by the specified Euler angles. Eulers are specified in degrees in XYZ order. This function has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the local space rotation.

    Parameters

    • x: number | Vec3

      3-dimensional vector holding local space rotation or rotation around local space x-axis in degrees.

    • Optionaly: number

      Rotation around local space y-axis in degrees.

    • Optionalz: number

      Rotation around local space z-axis in degrees.

    Returns void

    // Rotate via 3 numbers
    this.entity.rotateLocal(0, 90, 0);
    // Rotate via vector
    const r = new pc.Vec3(0, 90, 0);
    this.entity.rotateLocal(r);
  • Sets the world space rotation of the specified graph node using euler angles. Eulers are interpreted in XYZ order. Eulers must be specified in degrees. This function has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the world space euler rotation.

    Parameters

    • x: number | Vec3

      3-dimensional vector holding eulers or rotation around world space x-axis in degrees.

    • Optionaly: number

      Rotation around world space y-axis in degrees.

    • Optionalz: number

      Rotation around world space z-axis in degrees.

    Returns void

    // Set rotation of 90 degrees around world space y-axis via 3 numbers
    this.entity.setEulerAngles(0, 90, 0);
    // Set rotation of 90 degrees around world space y-axis via a vector
    const angles = new pc.Vec3(0, 90, 0);
    this.entity.setEulerAngles(angles);
  • Sets the local space rotation of the specified graph node using euler angles. Eulers are interpreted in XYZ order. Eulers must be specified in degrees. This function has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the local space euler rotation.

    Parameters

    • x: number | Vec3

      3-dimensional vector holding eulers or rotation around local space x-axis in degrees.

    • Optionaly: number

      Rotation around local space y-axis in degrees.

    • Optionalz: number

      Rotation around local space z-axis in degrees.

    Returns void

    // Set rotation of 90 degrees around y-axis via 3 numbers
    this.entity.setLocalEulerAngles(0, 90, 0);
    // Set rotation of 90 degrees around y-axis via a vector
    const angles = new pc.Vec3(0, 90, 0);
    this.entity.setLocalEulerAngles(angles);
  • Sets the local space position of the specified graph node. This function has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the local space position.

    Parameters

    • x: number | Vec3

      3-dimensional vector holding local space position or x-coordinate of local space position.

    • Optionaly: number

      Y-coordinate of local space position.

    • Optionalz: number

      Z-coordinate of local space position.

    Returns void

    // Set via 3 numbers
    this.entity.setLocalPosition(0, 10, 0);
    // Set via vector
    const pos = new pc.Vec3(0, 10, 0);
    this.entity.setLocalPosition(pos);
  • Sets the local space rotation of the specified graph node. This function has two valid signatures: you can either pass a quaternion or 3 numbers to specify the local space rotation.

    Parameters

    • x: number | Quat

      Quaternion holding local space rotation or x-component of local space quaternion rotation.

    • Optionaly: number

      Y-component of local space quaternion rotation.

    • Optionalz: number

      Z-component of local space quaternion rotation.

    • Optionalw: number

      W-component of local space quaternion rotation.

    Returns void

    // Set via 4 numbers
    this.entity.setLocalRotation(0, 0, 0, 1);
    // Set via quaternion
    const q = pc.Quat();
    this.entity.setLocalRotation(q);
  • Sets the local space scale factor of the specified graph node. This function has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the local space scale.

    Parameters

    • x: number | Vec3

      3-dimensional vector holding local space scale or x-coordinate of local space scale.

    • Optionaly: number

      Y-coordinate of local space scale.

    • Optionalz: number

      Z-coordinate of local space scale.

    Returns void

    // Set via 3 numbers
    this.entity.setLocalScale(10, 10, 10);
    // Set via vector
    const scale = new pc.Vec3(10, 10, 10);
    this.entity.setLocalScale(scale);
  • Sets the world space position of the specified graph node. This function has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the world space position.

    Parameters

    • x: number | Vec3

      3-dimensional vector holding world space position or x-coordinate of world space position.

    • Optionaly: number

      Y-coordinate of world space position.

    • Optionalz: number

      Z-coordinate of world space position.

    Returns void

    // Set via 3 numbers
    this.entity.setPosition(0, 10, 0);
    // Set via vector
    const position = new pc.Vec3(0, 10, 0);
    this.entity.setPosition(position);
  • Sets the world space rotation of the specified graph node. This function has two valid signatures: you can either pass a quaternion or 3 numbers to specify the world space rotation.

    Parameters

    • x: number | Quat

      Quaternion holding world space rotation or x-component of world space quaternion rotation.

    • Optionaly: number

      Y-component of world space quaternion rotation.

    • Optionalz: number

      Z-component of world space quaternion rotation.

    • Optionalw: number

      W-component of world space quaternion rotation.

    Returns void

    // Set via 4 numbers
    this.entity.setRotation(0, 0, 0, 1);
    // Set via quaternion
    const q = pc.Quat();
    this.entity.setRotation(q);
  • Translates the graph node in world space by the specified translation vector. This function has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the world space translation.

    Parameters

    • x: number | Vec3

      3-dimensional vector holding world space translation or x-coordinate of world space translation.

    • Optionaly: number

      Y-coordinate of world space translation.

    • Optionalz: number

      Z-coordinate of world space translation.

    Returns void

    // Translate via 3 numbers
    this.entity.translate(10, 0, 0);
    // Translate via vector
    const t = new pc.Vec3(10, 0, 0);
    this.entity.translate(t);
  • Translates the graph node in local space by the specified translation vector. This function has two valid signatures: you can either pass a 3D vector or 3 numbers to specify the local space translation.

    Parameters

    • x: number | Vec3

      3-dimensional vector holding local space translation or x-coordinate of local space translation.

    • Optionaly: number

      Y-coordinate of local space translation.

    • Optionalz: number

      Z-coordinate of local space translation.

    Returns void

    // Translate via 3 numbers
    this.entity.translateLocal(10, 0, 0);
    // Translate via vector
    const t = new pc.Vec3(10, 0, 0);
    this.entity.translateLocal(t);

Events

EVENT_DESTROY: string = 'destroy'

Fired after the entity is destroyed.

entity.on('destroy', (e) => {
console.log(`Entity ${e.name} has been destroyed`);
});