aruco-marker is a JavaScript library that can generate marker images (fiducials) for the Aruco augmented reality marker library. Aruco codes can be recognized by the original Aruco C++ library, or in the browser by js-aruco. aruco-marker generates images as SVG, making them easy to scale to any size or print out.
There are two demos that show off marker generation either directly or via the AngularJS directive:
aruco-marker is available for use directly in the browser, or via AMD (RequireJS), or in NodeJS. It is installable as aruco-marker from either NPM or Bower.
// In Node or RequireJS, require the library - otherwise
// ArucoMarker is already available as a browser global.
var ArucoMarker = require('aruco-marker');
var myMarker = new ArucoMarker(155);
var svgImage = myMarker.toSVG('500px'); // the size is optional
document.getElementById('marker').innerHTML = svgImage;See demos/index.html for a complete example.
If you want to embed Aruco markers in your AngularJS application, you can use the <aruco-marker> directive defined in ng-aruco-marker.js:
<aruco-marker marker-id="{{markerId}}" size="500px" />See demos/angular.html for a complete example.
While SVG images are very flexible and are perfect for most applications, you can use this technique to draw an SVG image to an HTML Canvas in order to obtain an image data URL if you need a raster image.
First, install NodeJS however you like for your system (on OSX, I use brew install node).
Then check out and build the project:
npm install -g grunt-cli
git clone https://github.com/bhollis/aruco-marker
cd aruco-marker
npm install
gruntCopyright (c) 2014 Benjamin Hollis. MIT Licensed, see MIT-LICENSE.txt for details.