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.7.0 version

The line component draws a line given a start coordinate and end coordinate using THREE.Line.

The raycaster component uses the line component for its showLine property, which is then used by the laser-controls component.


<a-entity line="start: 0, 1, 0; end: 2 0 -5; color: red"
line__2="start: -2, 4, 5; end: 0 4 -3; color: green"></a-entity>

Note an entity can have multiple lines. The line mesh is set as line or line__<ID> in the entity’s object3DMap:



Property Description Default Value
start Start point coordinate. 0, 0, 0
end End coordinate. 0, 0, 0
color Line color. #74BEC1
opacity Line opacity. 1
visible Whether the material visible. true