3D开发-AR.js 多Marker追踪支持
支持2个marker跟踪
代码参考
ARjs/three.js/examples/measure-it.html
// 支持追踪两个目标 ////////////////////////////////////////////////////////////////////////////// // markerRoot1 //////////////////////////////////////////////////////////////////////////////
// build markerControls var markerRoot1 = new THREE.Group markerRoot1.name = 'marker1' scene.add(markerRoot1) var markerControls = new THREEx.ArMarkerControls(arToolkitContext, markerRoot1, { type: 'pattern', patternUrl: "../../res/arjs/data/pattern-letterA.patt", // patternUrl : THREEx.ArToolkitContext.baseURL + '../data/data/patt.kanji', })
// add a gizmo in the center of the marker var geometry = new THREE.OctahedronGeometry(0.1, 0) var material = new THREE.MeshNormalMaterial({ wireframe: true }); var mesh = new THREE.Mesh(geometry, material); markerRoot1.add(mesh);
////////////////////////////////////////////////////////////////////////////// // markerRoot2 //////////////////////////////////////////////////////////////////////////////
// build markerControls var markerRoot2 = new THREE.Group markerRoot2.name = 'marker2' scene.add(markerRoot2) var markerControls = new THREEx.ArMarkerControls(arToolkitContext, markerRoot2, { type: 'pattern', // patternUrl : THREEx.ArToolkitContext.baseURL + '../data/data/patt.hiro', patternUrl: "../../res/arjs/data/pattern-letterB.patt", })
// add a gizmo in the center of the marker var geometry = new THREE.OctahedronGeometry(0.1, 0) var material = new THREE.MeshNormalMaterial({ wireframe: true }); var mesh = new THREE.Mesh(geometry, material); markerRoot2.add(mesh);
|
创建更多Marker
AR-Examples-master/custom-patterns.html
与上述使用方式类似