1.0.1 • Published 8 years ago

aframe-frustum-lock-component v1.0.1

Weekly downloads
3
License
MIT
Repository
github
Last release
8 years ago

Frustum Lock aframe component

Adding frustum-lock to your entities will automatically scale them to fill the entire camera view.

Entities with this component should be children of a camera entity, which will also lock them to the background of the camera.

Create Augmented Reality (AR) scenes by pairing with the aframe-video-billboard entitiy & component.

Schema

attributetypedefaultdescription
widthPropertystringwidthThe given property will be set to the frustum width.
heightPropertystringheightThe given property will be set to the frustum height.
depthnumber10Distance along the z-index to calculate frustum dimensions, and to positoin entity.
throttleTimeoutnumber100Frustum calculations are performed on resize and enter/exit vr. This throttles the calculations to every throttleTimeout milliseconds.

Installation

Browser

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://unpkg.com/aframe-frustum-lock-component"></script>
  <script>
    aframeFrustumLockComponent(window.AFRAME);
  </script>
</head>

<body>
  <a-scene>
    <a-camera>
      <a-plane frustum-lock material="color: #C03546"></a-plane>
    </a-camera>
  </a-scene>
</body>

npm

Install via npm:

npm install aframe-frustum-lock-component

Then register and use.

var aframe = require('aframe');
var aframeFrustumLockComponent = require('aframe-frustum-lock-component');
aframeFrustumLockComponent(aframe);