Index

skarf.js/skarf.js

Generic JavaScript augmented reality (AR) framework for handling different JavaScript AR libraries in Three.js
Version:
  • 1.0.4
Author:
Source:

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