A-Frame Extras

Add-ons and helpers for A-Frame VR.

Includes components for controls, model loaders, pathfinding, and more:

src
├── controls/ (Documentation)
│   ├── movement-controls.js
│   ├── checkpoint-controls.js
│   ├── gamepad-controls.js
│   ├── keyboard-controls.js
│   ├── touch-controls.js
│   └── trackpad-controls.js
├── loaders/ (Documentation)
│   ├── animation-mixer.js
│   ├── collada-model-legacy.js
│   ├── fbx-model.js
│   ├── gltf-model-legacy.js
│   └── object-model.js
├── misc/ (Documentation)
│   ├── checkpoint.js
│   ├── cube-env-map.js
│   ├── grab.js
│   ├── mesh-smooth.js
│   ├── normal-material.js
│   └── sphere-collider.js
├── pathfinding/ (Documentation)
│   ├── nav-mesh.js
│   └── nav-agent.js
└── primitives/ (Documentation)
    ├── a-grid.js
    ├── a-ocean.js
    └── a-tube.js

Usage (Scripts)

In the dist/ folder, download any package(s) you need. Include the scripts on your page, and all components are automatically registered for you:

replace 7.4.0 by another tag or a commit hash (for example 3e0ab50) if you want to use a build from master branch. You can look at the commits and use the latest commit hash.

For partial builds, use a subpackage like aframe-extras.controls.min.js. Full list of packages above.

A-Frame Version Compatibility

> NOTE: Several components and examples also rely on aframe-physics-system.

Usage (NPM)

npm install --save aframe-extras

// index.js
import 'aframe-extras';
// or specific packages
import "aframe-extras/controls/index.js";
import "aframe-extras/pathfinding/index.js";

Once installed, you'll need to compile your JavaScript using something like webpack with three defined as external, see webpack.config.js in this repo for an example.

Examples

A live set of usage examples can be found here:

https://c-frame.github.io/aframe-extras/examples/

Deprecated Components

The following components existed in previous versions of A-Frame Extras, but have been removed as of the latest release