visible

NOTE: This version of the documentation tracks unstable development happening on A-Frame’s master branch. If you wish to try it out, grab the unstable build. Otherwise, head to the documentation for the current 0.8.0 version

The visible component determines whether to render an entity.

Example

<a-entity visible="false"></a-entity>

Value

Value Description
true The entity will be rendered and visible; the default value.
false The entity will not be rendered nor visible. The entity will still exist in the scene.

Animating Visibility

The visible value can be “animated” to delay the visibility of an entity:

<!-- Wait 1 second before showing the entity. -->
<a-entity visible="false">
<a-animation attribute="visible" begin="1000" to="true"></a-animation>
</a-entity>

Updating Visible

It is slightly faster to update visibility at the three.js level versus via .setAttribute.

// With three.js
el.object3D.visible = false;

// With .setAttribute.
el.setAttribute('visible', false);

Updates at the three.js level will still be reflected when doing entityEl.getAttribute('visible');.