使用JSARToolKit5 开发AR应用 (2) Marker

相关站点

jsartoolkit5 - ARToolkit.js

Talkingdata - 用数据的心智去超越

three.js 系列教程 - 良心之做

JSARToolKit 支持多种标记

本文概述了不一样的Marker类型，它们是如何在加强现实应用中使用它们的呢。

这是JSARToolKit Marker的基本概述。

Marker是图像或视频中的功能，JSARToolKit能够跟踪并告知您他们在哪里以及他们指向什么位置方向。

JSARToolKit能够跟踪的标记是平面图像。

在“

JSARToolKit5简介”

文章中，咱们将一个可打开的框放在条形码标记之上，这是一种特殊类型的内置方形标记，用于对其模式中的数字进行编码。

JSARToolKit中有两种其余类型的标记：方形图像标记和NFT（天然特征跟踪）标记。

方形图像标记是由黑色和白色轮廓包围的正方形图像。

NFT标记是使用先进的计算机视觉机制跟踪自由形式的图像标记。

咱们来详细了解每一个标记类型，并附上一些您能够玩的样品。

图案标记

图案标记是具备黑色和白色边框的正方形图像，可用于以最少的CPU使用来跟踪自定义图像。

图案标记应该有一个厚实的黑色边框，被一个厚实的白色边框包围。

正方形内的图像应该是高对比度和旋转非对称的（意思是：若是将其平放在桌子上并旋转90度，180度或270度，则每一个角度应该看起来不一样）

高对比度要求的缘由是ARToolKit的工做原理。

ARToolKit将视频图像转换为黑白阈值图像，而后在该图像中查找矩形。

找到形状后，它会在矩形中采样像素，并将读取的像素与注册的标记进行比较。

若是足够的像素与标记相匹配，ARToolKit会告诉您的应用程序，它会找到一个标记，并计算将一个正方形变成矩形在屏幕上的形状的转换矩阵。

这是一个代码片断，初始化JSARToolKit并加载模式标记。

当视频中看到模式标记时，下面的代码将标记详细信息记录到控制台。

var video = document.querySelector('video');
var ar = new ARController(video.videoWidth, video.videoHeight, 'Data/camera_para.dat');
ar.onload = function() {
	var markerId;

	// Load pattern marker.
	//
	ar.loadMarker('Data/patt.hiro', function(marker) {
		markerId = marker;
	});

	ar.addEventListener('getMarker', function(ev) {
		if (ev.data.marker.idPatt === markerId) {
			console.log('saw marker', ev.data.marker);
			console.log('transformation matrix', ar.getTransformationMatrix());
		}
	});

	console.log('camera matrix', ar.getCameraMatrix());

	setInterval(function() {
		ar.process(video);
	}, 33);
};复制代码

您能够在 此演示中看到模式标记跟踪。

条码标记

条码标记使用二进制码在黑白标记上画一个数字。

它们不须要预先注册并使用很是少的CPU。

认为他们是很是低分辨率的QR码，你有这个想法。

他们在封面下工做的方式很像模式标记。

库读回阈值图像数据，将其转换为二进制，并将位转换为数字。

使用条形码标记比使用图案标记更容易。

全部您须要作的是将ARController的模式检测模式设置为其中一种条形码检测模式，并检查标记对象的idMatrix属性。

arController.setPatternDetectionMode( artoolkit.AR_MATRIX_CODE_DETECTION );

arController.addEventListener('getMarker', function(ev) {
	console.log('saw barcode marker', ev.data.marker.idMatrix);
});复制代码

您能够在

此演示中

看到模式标记跟踪。

混合模式跟踪

使用混合模式标记跟踪，您能够跟踪图案标记和条形码标记。

这比跟踪只有一种类型的标记更容易出错，由于某些图案标记可能被误认为条形码标记。

可是若是你须要这样作，它很简单，只需将ARController的模式检测模式设置为混合模式跟踪。

在混合模式跟踪中，getMarker事件返回的标记分别具备idMatrix或idPatt属性，分别设置为条形码ID或模式标记ID。

不匹配的id设置为-1。

如下是如何作到这一点：

arController.setPatternDetectionMode( artoolkit.AR_TEMPLATE_MATCHING_COLOR_AND_MATRIX );

arController.addEventListener('getMarker', function(ev) {
	if (ev.data.marker.idMatrix !== -1) {
		console.log('saw barcode marker', ev.data.marker.idMatrix);
	}
	if (ev.data.marker.idPatt !== -1) {
		console.log('saw pattern marker', ev.data.marker.idPatt);
	}
});复制代码

您能够在

此演示中

看到混合模式标记跟踪

。

NFT标记

NFT（天然特征跟踪）标记用于跟踪自定义矩形图像，而且不须要标记为正方形或在图像周围具备粗边框。

例如，若是您想在架构书中弹出交互式3D模型来构建照片，则能够在每张建筑照片中建立一个NFT标记。

要使用NFT，您须要事先建立标记（参见

关于NFT标记训练的ARToolKit文档

）。

NFT标记包含不一样尺度的多个版本的标记图像。

这样，跟踪器能够进行快速的自上而下的图像匹配，从尝试低分辨率匹配开始，并将其降低到相机分辨率匹配。

还没有在JSARToolKit5中实现NFT标记。

多标记跟踪

您能够组合方形图像标记和条形码标记来进行多标记跟踪。

在多标记跟踪中，您已经在单个平面上打印了几个标记，即便某些标记不可见，也能够跟踪表面。

以这种方式，多标记跟踪能够以更加鲁棒的方式跟踪表面，而牺牲了一些额外的CPU使用。

多标记跟踪的另外一个优势是您能够将小标记放在非标记内容周围，并使非标记内容的行为像标记。

例如，若是您将地图图像打印在一张纸上，并在其周围印有小标记，则能够将AR内容放在地图的顶部，只要任何多标记图像可见，它就能够工做。

在这个意义上，多标记跟踪的行为有点像NFT跟踪。

多标记与NFT的缺点是您须要使用方形标记图像进行跟踪。

这些优势是，多标记对于将跟踪表面部分遮挡起来更加坚固，而且它们在CPU使用方面更便宜。

var markerId;
var markerCount = 0;

// Load multimarker.
//
arController.loadMultiMarker('Data/multi-barcode-4x3.dat', function(marker, subMarkerCount) {
	markerId = marker;
	markerCount = subMarkerCount;
});

arController.addEventListener('getMultiMarker', function(ev) {
	if (ev.data.multiMarkerId === markerId) {
		console.log('saw multimarker', ev.data.multiMarkerId);
		console.log('transformation matrix', arController.getTransformationMatrix());
	}
});

arController.addEventListener('getMultiMarkerSub', function(ev) {
	if (ev.data.multiMarkerId === markerId) {
		console.log('saw submarker', ev.data.markerId, ev.data.marker);
	}
});
复制代码

您能够在

此演示中

看到多标记跟踪。

结论

咱们已经了解了JSARToolKit中可用的不一样类型的标记以及如何使用它们。

您能够跟踪的不一样类型的标记是方形图像标记，条形码标记，NFT标记和多标记。

选择使用哪一种类型的标记取决于您的要求。

若是您须要快速跟踪，请使用方形标记。

若是您须要自定义标记图形，则能够使用方形自定义标记或NFT标记。

若是您须要非正方形标记，则须要使用NFT标记或多标记跟踪。

对于强大的跟踪，请使用多标记跟踪。