TypeScript icon, indicating that this package has built-in type declarations

1.0.3 • Public • Published

ThreeJS Utils

This library contains utility functions, created to speed up augmented reality development.

You may also be interested in:

  • Zappar for Threejs (website, NPM)
  • Zappar for A-Frame (website, NPM)
  • Zappar for React+three.js (website, NPM)
  • Zappar for Unity (website)
  • Zappar for JavaScript (website, NPM), if you'd like to build content with a different 3D rendering platform
  • ZapWorks Studio (website), a full 3D development environment built for AR, VR and MR

Table Of Contents

Click to expand table of contents

Starting Development

You can use this library by downloading a standalone zip containing the necessary files, by linking to our CDN, or by installing from NPM for use in a webpack project.

Standalone Download

Download the bundle from this link: https://libs.zappar.com/zappar-threejs-utils/1.0.3/zappar-threejsutils.zip

Unzip into your web project and reference from your HTML like this:

<script src="zappar-threejsutils.js"></script>


Reference the zappar-threejsutils.js library from your HTML like this:

<script src="https://libs.zappar.com/zappar-threejs-utils/1.0.3/zappar-threejsutils.js"></script>

NPM Webpack Package

Run the following NPM command inside your project directory:

npm install --save @zappar/threejs-utils

Then import the library into your JavaScript or TypeScript files:

import * as ZapparUtils from "@zappar/threejs-utils";



BillboardGroup acts in the same way as THREE.Group except that each frame it rotates so that it faces the camera.

To construct, pass in three parameters:

  • camera - A ZapparThree.Camera.
  • anchorGroup - A ZapparThree anchor group.
  • axis options - Object defining the axis around which the children will rotate in order to face the camera.
import * as ZapparUtils from "@zappar/threejs-utils";

// ...
const camera = new ZapparThree.Camera();

const tracker = new ZapparThree.InstantWorldTracker();
const trackerGroup = new ZapparThree.InstantWorldAnchorGroup(camera, tracker);

const billboardGroup = new ZapparUtils.BillboardGroup(trackerGroup, camera, {
  Y: true,
  // Y: false,
  // Z: false,



npm i @zappar/threejs-utils

DownloadsWeekly Downloads






Unpacked Size

13.5 kB

Total Files


Last publish


  • seenevz
  • cgauld
  • deim
  • simon_zappar
  • jordan-zappar
  • george.martin
  • emmaford
  • squeral
  • francesca.may
  • justin_zappar