js-aruco is a port of ArUco library to JavaScript.

ArUco is a minimal library for Augmented Reality applications based on OpenCv.

Some parts of this project are a direct traslation to JavaScript from original C++ source code found on OpenCV, a library of programming functions for real time computer vision.

How to use?

Create an AR.Detector object. Call detect function.

var detector = new AR.Detector();

var markers = detector.detect(imageData);

imageData argument must be a valid ImageData canvas object.

var canvas = document.getElementById("canvas");
    
var context = canvas.getContext("2d");

var imageData = context.getImageData(0, 0, width, height);

What you get?

An array of Ar.Marker objects with detected markers.

AR.Marker objects have two properties:

• id: Marker id.
• corners: 2D marker corners.

Demos

100% JavaScript (see details bellow):

- Webcam live demo!

Visual Debugging:

- Debug session jam!

Flash camera access (see details bellow):

- Webcam live demo!

Videos

Webcam video adquisition:

100% JavaScript:

Visual Debugging:

Markers

A 7x7 grid with an external unused black border.

Internal 5x5 cells contains id information. Each row must be any of the following patterns:

white - black - black - black - black

white - black - white - white - white

black - white - black - black - white

black - white - white - white - black

WebCam Access

To test 100% JavaScript demos:

1) Install Chrome 18 or newest.

And add --enable-media-stream flag to command line, or use chrome://flags to activate it.

2) Or install a special Opera browser build: http://labs.opera.com/news/2011/10/19/

And allow access to webcam camera: opera:config#SecurityPrefs|AllowCameraToCanvasCopy

Flash Demo (deprecated)

Use Flashcam, a minimal Flash library to capture video.