Skip to content

jo-chemla/aframe-layout-component

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

31 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

aframe-layout-component

3D layout component and helpers for A-Frame VR.

Properties

Property Description Default Value
type Type of layout. Can be one of box, circle, cube, dodecahedron, line, pyramid. line
margin Margin in meters. 1
radius Radius in meters. 1

Usage

Browser Installation

Install and use by directly including the browser files:

<head>
  <title>My A-Frame Scene</title>
  <script src="https://aframe.io/releases/0.2.0/aframe.min.js"></script>
  <script src="https://rawgit.com/ngokevin/aframe-layout-component/master/dist/aframe-layout-component.min.js"></script>
</head>

<body>
  <a-scene>
    <a-entity layout="type: circle; margin: 10">
      <a-entity geometry="primitive: box" material></a-entity>
      <a-entity geometry="primitive: box" material></a-entity>
      <a-entity geometry="primitive: box" material></a-entity>
      <a-entity geometry="primitive: box" material></a-entity>
      <a-entity geometry="primitive: box" material></a-entity>
      <a-entity geometry="primitive: box" material></a-entity>
      <a-entity geometry="primitive: box" material></a-entity>
      <a-entity geometry="primitive: box" material></a-entity>
    </a-entity>
  </a-scene>
</body>

NPM Installation

Install via NPM:

npm install aframe-layout-component

Then register and use.

require('aframe');
require('aframe-layout-component');

About

3D layout component for A-Frame VR.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 100.0%