Examples

Preload Assets

Use this option to preload assets for a specific preset.

// import the Web SDK
const { init, errorCodes } = window.anylinejs;

// if copied into node_modules
// import { init, errorCodes } from 'anyline-js';


// create a view configuration
const viewConfig = {
    ...
};

const anylicense = 'xxxxxxx-your-license-xxxxxxx';

// access the container you want to mount the Web SDK into
const root = document.getElementById('root');

// initialize the Web SDK with optional presets
// presets will override some dimension configuration of your viewConfig and modules in the Web SDK config
const Anyline = init({
    preset: 'your-selected-preset',
    preload: true,
    viewConfig,
    license: anylicense,
    element: root,
});

// preload the assets for the preset.
Anyline.preload();

Lock Screen Orientation

Use this option to lock the screen orientation to portrait mode. For this to work the app will go into fullscreen mode!

// import the Web SDK
const { init, errorCodes } = window.anylinejs;

// if copied into node_modules
// import { init, errorCodes } from 'anyline-js';


// create a view configuration
const viewConfig = {
    ...
};

const anylicense = 'xxxxxxx-your-license-xxxxxxx';

// access the container you want to mount the Web SDK into
const root = document.getElementById('root');

// initialize the Web SDK with optional presets
// presets will override some dimension configuration of your viewConfig and modules in the Web SDK config
const Anyline = init({
    lockPortraitOrientation: {
        // set the element which will be used for fullscreen mode.
        element: root,
        // enable lock screen orientation
        lock: true,
    },
    preset: 'germanid',
    viewConfig,
    license: anylicense,
    element: root,
});

Anyline.startScanning();

Anyline.onResult = function(result) {
    console.log('Anyline has result: ', result);
};

Fetching frames manually from Camera

In order to manually fetch image frames from the camera, you can use the following code to do so:

if (anyline) {
	const image = anyline.getFrame();
	let element;
	if (image) {
		const canvas = document.createElement('canvas');
		const ctx = canvas.getContext('2d');
		canvas.width = blop.width;
		canvas.height = blop.height;
		if (ctx) {
			ctx.putImageData(blop, 0, 0);
			element = document.createElement('img');
			element.style.position = 'fixed';
			element.style.top = '0';
			element.style.left = '0';
			element.style.zIndex = '100000';
			element.style.maxWidth = '240px';
			element.src = canvas.toDataURL();
			document.body.appendChild(element);
		}
	}
}