ss

sparkar-screen

Spark AR Screen is a script utility for converting coordinate and positioning object.

Showing:

Popularity

Downloads/wk

3

GitHub Stars

8

Maintenance

Last Commit

4mos ago

Contributors

0

Package

Dependencies

0

Size (min+gzip)

1.7KB

License

MIT

Type Definitions

Built-In

Tree-Shakeable

No?

Categories

Readme

Screen

index

Screen is a Spark AR script utility for the following purpose:

  1. Convert coordinate World Position, Canvas Position, Face Position to Focal Plane Position.
  2. Positioning 3D object (e.g. plane) by percent [0-1].
  3. Scale 3D object to fit different screen size.

Install

NPM

You can download script and import it into your Spark AR project, or use this with npm.

  1. Download Screen.ts

  2. Drag/Import it into your project. (Spark AR support TypeScript since v105)

  3. Import Screen module at the top of your script.

    import * as Screen from './Screen';
    
  1. You can also Click Here to Download Sample Project (v115.1).

Usage

Convert Tracker's Position

const FaceTracking = require('FaceTracking');
const Screen = require('./Screen');

const face = FaceTracking.face(0);
const feature = face.cameraTransform.applyToPoint(face.leftEye.center);

(async function () {
    const position = await Screen.cameraTransformToFocalDistance(feature);
    const focalPlanePosition = await Screen.cameraTransformToFocalPlane(feature);
    const canvasPosition = await Screen.cameraTransformToCanvas(feature);
})();

Positioning with Percent

const Scene = require('Scene');
const Screen = require('./Screen');

(async function () {
    const positioning = await Scene.root.findFirst('positioning');
    positioning.transform.x = await Screen.percentToFocalPlaneX(.1);
    positioning.transform.y = await Screen.percentToFocalPlaneY(.2);
})();

Scale Object by Screen Size

It's recommanded to use this with percentage positioning.

const Scene = require('Scene');
const Screen = require('./Screen');

(async function () {
    const scaler = Screen.createScaler(9, 16);
    const scaleTarget = await Scene.root.findFirst('scaleTarget');
    scaler.autoScaleObject(scaleTarget);
})();

Coordinate Converting Included

Canvas PositionFocal Plane PositionPercentage Position
Canvas Position to
Focal Plane Position to
Percent Position to
Face Position to
World Position to

Donations

If this is useful for you, please consider a donation🙏🏼. One-time donations can be made with PayPal.

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100
No reviews found
Be the first to rate

Alternatives

No alternatives found

Tutorials

No tutorials found
Add a tutorial