Generic JavaScript augmented reality (AR) framework for handling different JavaScript AR libraries in Three.js
Examples
//How to setup Skarf
//create a Skarf instance which uses JSARToolKit (as an example)
var source = document.getElementById('myVideo');
var canvasContainerElem = document.getElementById('canvasContainer');
var camFov = 40.0; //this must be the same value used in the Three.js render cam too
var skarf = new SKARF.Skarf({
arLibType: 'jsartoolkit',
trackingElem: source,
markerSize: 1,
verticalFov: camFov, //you can leave this out because JSARToolKit default projection matrix seems to work better for generic web cams
threshold: 128,
debug: options.displayDebugView,
canvasContainerElem: canvasContainerElem,
renderer: renderer,
scene: scene,
camera: camera,
markersJsonFile: 'models/models_jsartoolkit.json'
});
//update on every frame
skarf.update(dt);
//How to use GUI markers
//in JSON file, define GUI marker
"32": {
"name": "Sculpt Amount",
"key": "sculptAmountSlider",
"type": "slider",
"params": {
"speed": 0.01
}
}
//in your JavaScript, define callback function which will be called when "changed" event happens for the key "sculptAmountSlider" (in the format myKey_myEvent)
sculptAmountSlider_changed = function (params) {
//params.delta will give the changed amount that you should add to your variable
}
//for a full list of events and params available, please refer to the individual classes in this doc