Skip to content

A
AR.js

cqiang1993 / AR.js
与 Fork 源项目一致

从无法访问的项目Fork

通知 2
Star 0
Fork 0
A
AR.js

体验新版 GitCode，发现更多精彩内容 >>

提交 32e1e29d 编写于 作者: N nicolo.carpignoli
浏览文件
操作

chore: fix clean paths problems

上级 0e61fae5
隐藏空白更改
内联 并排
Showing with 478 addition and 478 deletion
aframe/src/component-anchor.js
浏览文件 @ 32e1e29d
......@@ -2,196 +2,196 @@
// arjs-anchor
//////////////////////////////////////////////////////////////////////////////
AFRAME.registerComponent('arjs-anchor', {
dependencies: ['arjs', 'artoolkit'],
schema: {
preset: {
type: 'string',
},
markerhelpers : { // IIF preset === 'area'
type: 'boolean',
default: false,
},
dependencies: ['arjs', 'artoolkit'],
schema: {
preset: {
type: 'string',
},
markerhelpers: { // IIF preset === 'area'
type: 'boolean',
default: false,
},
// controls parameters
size: {
type: 'number',
default: 1
},
type: {
type: 'string',
},
patternUrl: {
type: 'string',
},
barcodeValue: {
type: 'number'
},
changeMatrixMode: {
type: 'string',
default : 'modelViewMatrix',
},
minConfidence: {
type: 'number',
default: 0.6,
},
smooth: {
type: 'boolean',
default: false,
},
smoothCount: {
type: 'number',
default: 5,
},
smoothTolerance: {
type: 'number',
default: 0.01,
},
smoothThreshold: {
type: 'number',
default: 2,
},
},
init: function () {
var _this = this
// controls parameters
size: {
type: 'number',
default: 1
},
type: {
type: 'string',
},
patternUrl: {
type: 'string',
},
barcodeValue: {
type: 'number'
},
changeMatrixMode: {
type: 'string',
default: 'modelViewMatrix',
},
minConfidence: {
type: 'number',
default: 0.6,
},
smooth: {
type: 'boolean',
default: false,
},
smoothCount: {
type: 'number',
default: 5,
},
smoothTolerance: {
type: 'number',
default: 0.01,
},
smoothThreshold: {
type: 'number',
default: 2,
},
},
init: function () {
var _this = this
// get arjsSystem
var arjsSystem = this.el.sceneEl.systems.arjs || this.el.sceneEl.systems.artoolkit
// get arjsSystem
var arjsSystem = this.el.sceneEl.systems.arjs || this.el.sceneEl.systems.artoolkit
//////////////////////////////////////////////////////////////////////////////
// Code Separator
//////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////
// Code Separator
//////////////////////////////////////////////////////////////////////////////
_this.isReady = false
_this._arAnchor = null
_this.isReady = false
_this._arAnchor = null
// honor object visibility
if( _this.data.changeMatrixMode === 'modelViewMatrix' ){
_this.el.object3D.visible = false
}else if( _this.data.changeMatrixMode === 'cameraTransformMatrix' ){
_this.el.sceneEl.object3D.visible = false
}else console.assert(false)
// honor object visibility
if (_this.data.changeMatrixMode === 'modelViewMatrix') {
_this.el.object3D.visible = false
} else if (_this.data.changeMatrixMode === 'cameraTransformMatrix') {
_this.el.sceneEl.object3D.visible = false
} else console.assert(false)
// trick to wait until arjsSystem is isReady
var startedAt = Date.now()
var timerId = setInterval(function(){
// wait until the system is isReady
if( arjsSystem.isReady === false ) return
// trick to wait until arjsSystem is isReady
var startedAt = Date.now()
var timerId = setInterval(function () {
// wait until the system is isReady
if (arjsSystem.isReady === false) return
clearInterval(timerId)
clearInterval(timerId)
//////////////////////////////////////////////////////////////////////////////
// update arProfile
//////////////////////////////////////////////////////////////////////////////
var arProfile = arjsSystem._arProfile
//////////////////////////////////////////////////////////////////////////////
// update arProfile
//////////////////////////////////////////////////////////////////////////////
var arProfile = arjsSystem._arProfile
// arProfile.changeMatrixMode('modelViewMatrix')
arProfile.changeMatrixMode(_this.data.changeMatrixMode)
// arProfile.changeMatrixMode('modelViewMatrix')
arProfile.changeMatrixMode(_this.data.changeMatrixMode)
// honor this.data.preset
var markerParameters = Object.assign({}, arProfile.defaultMarkerParameters)
// honor this.data.preset
var markerParameters = Object.assign({}, arProfile.defaultMarkerParameters)
if( _this.data.preset === 'hiro' ){
markerParameters.type = 'pattern'
markerParameters.patternUrl = '../../three.js/examples/marker-training/examples/pattern-files/pattern-hiro.patt'
markerParameters.markersAreaEnabled = false
}else if( _this.data.preset === 'kanji' ){
markerParameters.type = 'pattern'
markerParameters.patternUrl = '../../three.js/examples/marker-training/examples/pattern-files/pattern-kanji.patt'
markerParameters.markersAreaEnabled = false
}else if( _this.data.preset === 'area' ){
markerParameters.type = 'barcode'
markerParameters.barcodeValue = 1001
markerParameters.markersAreaEnabled = true
}else if( _this.data.type === 'barcode' ){
markerParameters = {
type: _this.data.type,
changeMatrixMode: 'modelViewMatrix',
barcodeValue: _this.data.barcodeValue,
markersAreaEnabled: false
}
}else if( _this.data.type === 'pattern' ){
markerParameters.type = _this.data.type
markerParameters.patternUrl = _this.data.patternUrl;
markerParameters.markersAreaEnabled = false
}else {
// console.assert( this.data.preset === '', 'illegal preset value '+this.data.preset)
}
if (_this.data.preset === 'hiro') {
markerParameters.type = 'pattern'
markerParameters.patternUrl = THREEx.ArToolkitContext.baseURL + 'examples/marker-training/examples/pattern-files/pattern-hiro.patt'
markerParameters.markersAreaEnabled = false
} else if (_this.data.preset === 'kanji') {
markerParameters.type = 'pattern'
markerParameters.patternUrl = THREEx.ArToolkitContext.baseURL + 'examples/marker-training/examples/pattern-files/pattern-kanji.patt'
markerParameters.markersAreaEnabled = false
} else if (_this.data.preset === 'area') {
markerParameters.type = 'barcode'
markerParameters.barcodeValue = 1001
markerParameters.markersAreaEnabled = true
} else if (_this.data.type === 'barcode') {
markerParameters = {
type: _this.data.type,
changeMatrixMode: 'modelViewMatrix',
barcodeValue: _this.data.barcodeValue,
markersAreaEnabled: false
}
} else if (_this.data.type === 'pattern') {
markerParameters.type = _this.data.type
markerParameters.patternUrl = _this.data.patternUrl;
markerParameters.markersAreaEnabled = false
} else {
// console.assert( this.data.preset === '', 'illegal preset value '+this.data.preset)
}
markerParameters.smooth = _this.data.smooth;
markerParameters.smoothCount = _this.data.smoothCount;
markerParameters.smoothTolerance = _this.data.smoothTolerance;
markerParameters.smoothThreshold = _this.data.smoothThreshold;
markerParameters.smooth = _this.data.smooth;
markerParameters.smoothCount = _this.data.smoothCount;
markerParameters.smoothTolerance = _this.data.smoothTolerance;
markerParameters.smoothThreshold = _this.data.smoothThreshold;
//////////////////////////////////////////////////////////////////////////////
// create arAnchor
//////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////
// create arAnchor
//////////////////////////////////////////////////////////////////////////////
var arSession = arjsSystem._arSession
var arAnchor = _this._arAnchor = new ARjs.Anchor(arSession, markerParameters)
var arSession = arjsSystem._arSession
var arAnchor = _this._arAnchor = new ARjs.Anchor(arSession, markerParameters)
// it is now considered isReady
_this.isReady = true
// it is now considered isReady
_this.isReady = true
//////////////////////////////////////////////////////////////////////////////
// honor .debugUIEnabled
//////////////////////////////////////////////////////////////////////////////
if( arjsSystem.data.debugUIEnabled ){
// get or create containerElement
var containerElement = document.querySelector('#arjsDebugUIContainer')
if( containerElement === null ){
containerElement = document.createElement('div')
containerElement.id = 'arjsDebugUIContainer'
containerElement.setAttribute('style', 'position: fixed; bottom: 10px; width:100%; text-align: center; z-index: 1; color: grey;')
document.body.appendChild(containerElement)
}
// create anchorDebugUI
var anchorDebugUI = new ARjs.AnchorDebugUI(arAnchor)
containerElement.appendChild(anchorDebugUI.domElement)
}
}, 1000/60)
},
remove : function(){
},
update: function () {
},
tick: function(){
var _this = this
// if not yet isReady, do nothing
if( this.isReady === false ) return
//////////////////////////////////////////////////////////////////////////////
// honor .debugUIEnabled
//////////////////////////////////////////////////////////////////////////////
if (arjsSystem.data.debugUIEnabled) {
// get or create containerElement
var containerElement = document.querySelector('#arjsDebugUIContainer')
if (containerElement === null) {
containerElement = document.createElement('div')
containerElement.id = 'arjsDebugUIContainer'
containerElement.setAttribute('style', 'position: fixed; bottom: 10px; width:100%; text-align: center; z-index: 1; color: grey;')
document.body.appendChild(containerElement)
}
// create anchorDebugUI
var anchorDebugUI = new ARjs.AnchorDebugUI(arAnchor)
containerElement.appendChild(anchorDebugUI.domElement)
}
}, 1000 / 60)
},
remove: function () {
},
update: function () {
},
tick: function () {
var _this = this
// if not yet isReady, do nothing
if (this.isReady === false) return
//////////////////////////////////////////////////////////////////////////////
// update arAnchor
//////////////////////////////////////////////////////////////////////////////
var arjsSystem = this.el.sceneEl.systems.arjs || this.el.sceneEl.systems.artoolkit
this._arAnchor.update()
//////////////////////////////////////////////////////////////////////////////
// update arAnchor
//////////////////////////////////////////////////////////////////////////////
var arjsSystem = this.el.sceneEl.systems.arjs || this.el.sceneEl.systems.artoolkit
this._arAnchor.update()
//////////////////////////////////////////////////////////////////////////////
// honor pose
//////////////////////////////////////////////////////////////////////////////
var arWorldRoot = this._arAnchor.object3d
arWorldRoot.updateMatrixWorld(true)
arWorldRoot.matrixWorld.decompose(this.el.object3D.position, this.el.object3D.quaternion, this.el.object3D.scale)
//////////////////////////////////////////////////////////////////////////////
// honor pose
//////////////////////////////////////////////////////////////////////////////
var arWorldRoot = this._arAnchor.object3d
arWorldRoot.updateMatrixWorld(true)
arWorldRoot.matrixWorld.decompose(this.el.object3D.position, this.el.object3D.quaternion, this.el.object3D.scale)
//////////////////////////////////////////////////////////////////////////////
// honor visibility
//////////////////////////////////////////////////////////////////////////////
if( _this._arAnchor.parameters.changeMatrixMode === 'modelViewMatrix' ){
var wasVisible = _this.el.object3D.visible
_this.el.object3D.visible = this._arAnchor.object3d.visible
}else if( _this._arAnchor.parameters.changeMatrixMode === 'cameraTransformMatrix' ){
var wasVisible = _this.el.sceneEl.object3D.visible
_this.el.sceneEl.object3D.visible = this._arAnchor.object3d.visible
}else console.assert(false)
//////////////////////////////////////////////////////////////////////////////
// honor visibility
//////////////////////////////////////////////////////////////////////////////
if (_this._arAnchor.parameters.changeMatrixMode === 'modelViewMatrix') {
var wasVisible = _this.el.object3D.visible
_this.el.object3D.visible = this._arAnchor.object3d.visible
} else if (_this._arAnchor.parameters.changeMatrixMode === 'cameraTransformMatrix') {
var wasVisible = _this.el.sceneEl.object3D.visible
_this.el.sceneEl.object3D.visible = this._arAnchor.object3d.visible
} else console.assert(false)
// emit markerFound markerLost
if( _this._arAnchor.object3d.visible === true && wasVisible === false ){
_this.el.emit('markerFound')
}else if( _this._arAnchor.object3d.visible === false && wasVisible === true ){
_this.el.emit('markerLost')
}
// emit markerFound markerLost
if (_this._arAnchor.object3d.visible === true && wasVisible === false) {
_this.el.emit('markerFound')
} else if (_this._arAnchor.object3d.visible === false && wasVisible === true) {
_this.el.emit('markerLost')
}
}
}
})
//////////////////////////////////////////////////////////////////////////////
......@@ -199,36 +199,36 @@ AFRAME.registerComponent('arjs-anchor', {
//////////////////////////////////////////////////////////////////////////////
AFRAME.registerPrimitive('a-anchor', AFRAME.utils.extendDeep({}, AFRAME.primitives.getMeshMixin(), {
defaultComponents: {
'arjs-anchor': {},
'arjs-hit-testing': {},
},
mappings: {
'type': 'arjs-anchor.type',
'size': 'arjs-anchor.size',
'url': 'arjs-anchor.patternUrl',
'value': 'arjs-anchor.barcodeValue',
'preset': 'arjs-anchor.preset',
'min-confidence': 'arjs-anchor.minConfidence',
'marker-helpers': 'arjs-anchor.markerhelpers',
'smooth': 'arjs-anchor.smooth',
'smooth-count': 'arjs-anchor.smoothCount',
'smooth-tolerance': 'arjs-anchor.smoothTolerance',
'smooth-threshold': 'arjs-anchor.smoothThreshold',
defaultComponents: {
'arjs-anchor': {},
'arjs-hit-testing': {},
},
mappings: {
'type': 'arjs-anchor.type',
'size': 'arjs-anchor.size',
'url': 'arjs-anchor.patternUrl',
'value': 'arjs-anchor.barcodeValue',
'preset': 'arjs-anchor.preset',
'min-confidence': 'arjs-anchor.minConfidence',
'marker-helpers': 'arjs-anchor.markerhelpers',
'smooth': 'arjs-anchor.smooth',
'smooth-count': 'arjs-anchor.smoothCount',
'smooth-tolerance': 'arjs-anchor.smoothTolerance',
'smooth-threshold': 'arjs-anchor.smoothThreshold',
'hit-testing-render-debug': 'arjs-hit-testing.renderDebug',
'hit-testing-enabled': 'arjs-hit-testing.enabled',
}
'hit-testing-render-debug': 'arjs-hit-testing.renderDebug',
'hit-testing-enabled': 'arjs-hit-testing.enabled',
}
}))
AFRAME.registerPrimitive('a-camera-static', AFRAME.utils.extendDeep({}, AFRAME.primitives.getMeshMixin(), {
defaultComponents: {
'camera': {},
},
mappings: {
}
defaultComponents: {
'camera': {},
},
mappings: {
}
}))
//////////////////////////////////////////////////////////////////////////////
......@@ -236,42 +236,42 @@ AFRAME.registerPrimitive('a-camera-static', AFRAME.utils.extendDeep({}, AFRAME.p
//////////////////////////////////////////////////////////////////////////////
// FIXME
AFRAME.registerPrimitive('a-marker', AFRAME.utils.extendDeep({}, AFRAME.primitives.getMeshMixin(), {
defaultComponents: {
'arjs-anchor': {},
'arjs-hit-testing': {},
},
mappings: {
'type': 'arjs-anchor.type',
'size': 'arjs-anchor.size',
'url': 'arjs-anchor.patternUrl',
'value': 'arjs-anchor.barcodeValue',
'preset': 'arjs-anchor.preset',
'min-confidence': 'arjs-anchor.minConfidence',
'marker-helpers': 'arjs-anchor.markerhelpers',
'smooth': 'arjs-anchor.smooth',
'smooth-count': 'arjs-anchor.smoothCount',
'smooth-tolerance': 'arjs-anchor.smoothTolerance',
'smooth-threshold': 'arjs-anchor.smoothThreshold',
defaultComponents: {
'arjs-anchor': {},
'arjs-hit-testing': {},
},
mappings: {
'type': 'arjs-anchor.type',
'size': 'arjs-anchor.size',
'url': 'arjs-anchor.patternUrl',
'value': 'arjs-anchor.barcodeValue',
'preset': 'arjs-anchor.preset',
'min-confidence': 'arjs-anchor.minConfidence',
'marker-helpers': 'arjs-anchor.markerhelpers',
'smooth': 'arjs-anchor.smooth',
'smooth-count': 'arjs-anchor.smoothCount',
'smooth-tolerance': 'arjs-anchor.smoothTolerance',
'smooth-threshold': 'arjs-anchor.smoothThreshold',
'hit-testing-render-debug': 'arjs-hit-testing.renderDebug',
'hit-testing-enabled': 'arjs-hit-testing.enabled',
}
'hit-testing-render-debug': 'arjs-hit-testing.renderDebug',
'hit-testing-enabled': 'arjs-hit-testing.enabled',
}
}))
AFRAME.registerPrimitive('a-marker-camera', AFRAME.utils.extendDeep({}, AFRAME.primitives.getMeshMixin(), {
defaultComponents: {
'arjs-anchor': {
changeMatrixMode: 'cameraTransformMatrix'
},
'camera': {},
},
mappings: {
'type': 'arjs-anchor.type',
'size': 'arjs-anchor.size',
'url': 'arjs-anchor.patternUrl',
'value': 'arjs-anchor.barcodeValue',
'preset': 'arjs-anchor.preset',
'min-confidence': 'arjs-anchor.minConfidence',
'marker-helpers': 'arjs-anchor.markerhelpers',
}
defaultComponents: {
'arjs-anchor': {
changeMatrixMode: 'cameraTransformMatrix'
},
'camera': {},
},
mappings: {
'type': 'arjs-anchor.type',
'size': 'arjs-anchor.size',
'url': 'arjs-anchor.patternUrl',
'value': 'arjs-anchor.barcodeValue',
'preset': 'arjs-anchor.preset',
'min-confidence': 'arjs-anchor.minConfidence',
'marker-helpers': 'arjs-anchor.markerhelpers',
}
}))
three.js/examples/multi-markers/examples/threex-screenasportal/threex-screenasportal.js
浏览文件 @ 32e1e29d
var THREEx = THREEx || {}
THREEx.ScreenAsPortal = function(multiMarkerFile){
var _this = this
this.object3d = new THREE.Group
// init render loop
this._onRenderFcts = []
this.update = function(){
_this._onRenderFcts.forEach(function(onRenderFct){
onRenderFct()
})
}
// compute screenSize
var markerSize = 1
var whiteMargin = 0.125*2
var boundingBox = THREEx.ArMultiMarkerControls.computeBoundingBox(multiMarkerFile)
boundingBox.min.x -= markerSize/2 + whiteMargin
boundingBox.min.z -= markerSize/2 + whiteMargin
boundingBox.max.x += markerSize/2 + whiteMargin
boundingBox.max.z += markerSize/2 + whiteMargin
var screenSize = boundingBox.getSize()
// console.log('screenSize', screenSize)
var screenDepth = screenSize.z
initCube()
addTargets()
addBorders()
initLogo()
return
function initLogo(){
// add the inner box
var geometry = new THREE.PlaneGeometry(1,1).rotateX(-Math.PI/2)
var material = new THREE.MeshBasicMaterial({
side: THREE.DoubleSide,
map: new THREE.TextureLoader().load('../../data/logo/logo-black-transparent-512x204.png'),
alphaTest: 0.9,
})
var mesh = new THREE.Mesh( geometry, material )
mesh.scale.set(screenSize.x, 1, screenSize.x*204/512)
mesh.position.y = -screenDepth + 0.3
_this.object3d.add(mesh)
}
function initCube(){
// add outter cube - invisibility cloak
var geometry = new THREE.BoxGeometry(screenSize.x, screenDepth, screenSize.z)
geometry.faces.splice(4, 2) // make hole by removing top two triangles (is this assumption stable?)
var material = new THREE.MeshBasicMaterial({
colorWrite: false // only write to z-buf
})
var outterCubeMesh = new THREE.Mesh( geometry, material)
outterCubeMesh.scale.set(1.04, 1, 1.04)
outterCubeMesh.position.y = -geometry.parameters.height/2 + 0.15/2
_this.object3d.add(outterCubeMesh)
// add the inner box
var textureBox = new THREE.TextureLoader().load(THREEx.ScreenAsPortal.baseURL+'images/box.png')
textureBox.wrapS = THREE.RepeatWrapping;
textureBox.wrapT = THREE.RepeatWrapping;
textureBox.repeat.set(15, 20)
// textureBox.anisotropy = renderer.getMaxAnisotropy()
textureBox.anisotropy = 16;
var geometry = new THREE.BoxGeometry(screenSize.x, screenDepth, screenSize.z)
var material = new THREE.MeshBasicMaterial({
side: THREE.BackSide,
map: textureBox,
color: 'white',
})
var innerBoxMesh = new THREE.Mesh( geometry, material )
// innerBoxMesh.scale.set(0.96, 1, 0.96)
innerBoxMesh.position.y = -geometry.parameters.height/2
_this.object3d.add( innerBoxMesh )
}
function addTargets(){
// add the inner box
var geometry = new THREE.PlaneGeometry(0.8,0.8).rotateX(-Math.PI/2)
var material = new THREE.MeshBasicMaterial({
side: THREE.DoubleSide,
map: new THREE.TextureLoader().load(THREEx.ScreenAsPortal.baseURL+'images/target.png'),
alphaTest: 0.9,
})
var targetModel = new THREE.Mesh( geometry, material )
// create a blue LineBasicMaterial
var lineMaterial = new THREE.LineBasicMaterial({
color: 0x0000ff
})
var nTargets = 8;
for(var i = 0; i < nTargets; i++){
var positionX = (Math.random()-0.5)*(screenSize.x - targetModel.geometry.parameters.width )
var positionZ = (Math.random()-0.5)*(screenSize.z - targetModel.geometry.parameters.height)
var height = screenDepth*0.25 + Math.random() * (screenDepth * 2)
addTarget( positionX, positionZ, height)
}
return
function addTarget(positionX, positionZ, height){
var geometry = new THREE.Geometry()
geometry.vertices.push(new THREE.Vector3(0, 0, 0))
geometry.vertices.push(new THREE.Vector3(0, height-0.1, 0))
var line = new THREE.Line(geometry, lineMaterial)
line.position.x = positionX
line.position.y = -screenDepth
line.position.z = positionZ
_this.object3d.add(line)
var target = targetModel.clone()
target.position.copy(line.position)
target.position.y += height
_this.object3d.add(target)
}
}
//////////////////////////////////////////////////////////////////////////////
// addBorders
//////////////////////////////////////////////////////////////////////////////
function addBorders(){
var thickNess = 0.15
var material = new THREE.MeshNormalMaterial()
var material = new THREE.MeshBasicMaterial({
color: 'black',
// color: '#111',
})
// top border
var geometry = new THREE.BoxGeometry(screenSize.x, thickNess, thickNess).rotateX(Math.PI/4)
var mesh = new THREE.Mesh(geometry, material)
mesh.position.y = +thickNess/2
mesh.position.z = -screenSize.z/2
_this.object3d.add(mesh)
// bottom border
var mesh = new THREE.Mesh(geometry, material)
mesh.position.y = +thickNess/2
mesh.position.z = +screenSize.z/2
_this.object3d.add(mesh)
// left border
var geometry = new THREE.BoxGeometry(thickNess, thickNess, screenSize.z).rotateZ(Math.PI/4)
var mesh = new THREE.Mesh(geometry, material)
mesh.position.y = +thickNess/2
mesh.position.x = -screenSize.x/2
_this.object3d.add(mesh)
// right border
var mesh = new THREE.Mesh(geometry, material)
mesh.position.y = +thickNess/2
mesh.position.x = +screenSize.x/2
_this.object3d.add(mesh)
}
THREEx.ScreenAsPortal = function (multiMarkerFile) {
var _this = this
this.object3d = new THREE.Group
// init render loop
this._onRenderFcts = []
this.update = function () {
_this._onRenderFcts.forEach(function (onRenderFct) {
onRenderFct()
})
}
// compute screenSize
var markerSize = 1
var whiteMargin = 0.125 * 2
var boundingBox = THREEx.ArMultiMarkerControls.computeBoundingBox(multiMarkerFile)
boundingBox.min.x -= markerSize / 2 + whiteMargin
boundingBox.min.z -= markerSize / 2 + whiteMargin
boundingBox.max.x += markerSize / 2 + whiteMargin
boundingBox.max.z += markerSize / 2 + whiteMargin
var screenSize = boundingBox.getSize()
// console.log('screenSize', screenSize)
var screenDepth = screenSize.z
initCube()
addTargets()
addBorders()
initLogo()
return
function initLogo() {
// add the inner box
var geometry = new THREE.PlaneGeometry(1, 1).rotateX(-Math.PI / 2)
var material = new THREE.MeshBasicMaterial({
side: THREE.DoubleSide,
map: new THREE.TextureLoader().load(THREEx.ArToolkitContext.baseURL + '../data/logo/logo-black-transparent-512x204.png'),
alphaTest: 0.9,
})
var mesh = new THREE.Mesh(geometry, material)
mesh.scale.set(screenSize.x, 1, screenSize.x * 204 / 512)
mesh.position.y = -screenDepth + 0.3
_this.object3d.add(mesh)
}
function initCube() {
// add outter cube - invisibility cloak
var geometry = new THREE.BoxGeometry(screenSize.x, screenDepth, screenSize.z)
geometry.faces.splice(4, 2) // make hole by removing top two triangles (is this assumption stable?)
var material = new THREE.MeshBasicMaterial({
colorWrite: false // only write to z-buf
})
var outterCubeMesh = new THREE.Mesh(geometry, material)
outterCubeMesh.scale.set(1.04, 1, 1.04)
outterCubeMesh.position.y = -geometry.parameters.height / 2 + 0.15 / 2
_this.object3d.add(outterCubeMesh)
// add the inner box
var textureBox = new THREE.TextureLoader().load(THREEx.ScreenAsPortal.baseURL + 'images/box.png')
textureBox.wrapS = THREE.RepeatWrapping;
textureBox.wrapT = THREE.RepeatWrapping;
textureBox.repeat.set(15, 20)
// textureBox.anisotropy = renderer.getMaxAnisotropy()
textureBox.anisotropy = 16;
var geometry = new THREE.BoxGeometry(screenSize.x, screenDepth, screenSize.z)
var material = new THREE.MeshBasicMaterial({
side: THREE.BackSide,
map: textureBox,
color: 'white',
})
var innerBoxMesh = new THREE.Mesh(geometry, material)
// innerBoxMesh.scale.set(0.96, 1, 0.96)
innerBoxMesh.position.y = -geometry.parameters.height / 2
_this.object3d.add(innerBoxMesh)
}
function addTargets() {
// add the inner box
var geometry = new THREE.PlaneGeometry(0.8, 0.8).rotateX(-Math.PI / 2)
var material = new THREE.MeshBasicMaterial({
side: THREE.DoubleSide,
map: new THREE.TextureLoader().load(THREEx.ScreenAsPortal.baseURL + 'images/target.png'),
alphaTest: 0.9,
})
var targetModel = new THREE.Mesh(geometry, material)
// create a blue LineBasicMaterial
var lineMaterial = new THREE.LineBasicMaterial({
color: 0x0000ff
})
var nTargets = 8;
for (var i = 0; i < nTargets; i++) {
var positionX = (Math.random() - 0.5) * (screenSize.x - targetModel.geometry.parameters.width)
var positionZ = (Math.random() - 0.5) * (screenSize.z - targetModel.geometry.parameters.height)
var height = screenDepth * 0.25 + Math.random() * (screenDepth * 2)
addTarget(positionX, positionZ, height)
}
return
function addTarget(positionX, positionZ, height) {
var geometry = new THREE.Geometry()
geometry.vertices.push(new THREE.Vector3(0, 0, 0))
geometry.vertices.push(new THREE.Vector3(0, height - 0.1, 0))
var line = new THREE.Line(geometry, lineMaterial)
line.position.x = positionX
line.position.y = -screenDepth
line.position.z = positionZ
_this.object3d.add(line)
var target = targetModel.clone()
target.position.copy(line.position)
target.position.y += height
_this.object3d.add(target)
}
}
//////////////////////////////////////////////////////////////////////////////
// addBorders
//////////////////////////////////////////////////////////////////////////////
function addBorders() {
var thickNess = 0.15
var material = new THREE.MeshNormalMaterial()
var material = new THREE.MeshBasicMaterial({
color: 'black',
// color: '#111',
})
// top border
var geometry = new THREE.BoxGeometry(screenSize.x, thickNess, thickNess).rotateX(Math.PI / 4)
var mesh = new THREE.Mesh(geometry, material)
mesh.position.y = +thickNess / 2
mesh.position.z = -screenSize.z / 2
_this.object3d.add(mesh)
// bottom border
var mesh = new THREE.Mesh(geometry, material)
mesh.position.y = +thickNess / 2
mesh.position.z = +screenSize.z / 2
_this.object3d.add(mesh)
// left border
var geometry = new THREE.BoxGeometry(thickNess, thickNess, screenSize.z).rotateZ(Math.PI / 4)
var mesh = new THREE.Mesh(geometry, material)
mesh.position.y = +thickNess / 2
mesh.position.x = -screenSize.x / 2
_this.object3d.add(mesh)
// right border
var mesh = new THREE.Mesh(geometry, material)
mesh.position.y = +thickNess / 2
mesh.position.x = +screenSize.x / 2
_this.object3d.add(mesh)
}
}
THREEx.ScreenAsPortal.baseURL = '../'
three.js/src/threex/threex-artoolkitprofile.js
浏览文件 @ 32e1e29d
......@@ -8,26 +8,26 @@ var THREEx = THREEx || {}
* - you can use this class to understand how to tune your specific usecase
* - it is made to help people to build parameters without understanding all the underlying details.
*/
ARjs.Profile = THREEx.ArToolkitProfile = function(){
this.reset()
ARjs.Profile = THREEx.ArToolkitProfile = function () {
this.reset()
this.performance('default')
this.performance('default')
}
ARjs.Profile.prototype._guessPerformanceLabel = function() {
var isMobile = navigator.userAgent.match(/Android/i)
|| navigator.userAgent.match(/webOS/i)
|| navigator.userAgent.match(/iPhone/i)
|| navigator.userAgent.match(/iPad/i)
|| navigator.userAgent.match(/iPod/i)
|| navigator.userAgent.match(/BlackBerry/i)
|| navigator.userAgent.match(/Windows Phone/i)
? true : false
if( isMobile === true ){
return 'phone-normal'
}
return 'desktop-normal'
ARjs.Profile.prototype._guessPerformanceLabel = function () {
var isMobile = navigator.userAgent.match(/Android/i)
|| navigator.userAgent.match(/webOS/i)
|| navigator.userAgent.match(/iPhone/i)
|| navigator.userAgent.match(/iPad/i)
|| navigator.userAgent.match(/iPod/i)
|| navigator.userAgent.match(/BlackBerry/i)
|| navigator.userAgent.match(/Windows Phone/i)
? true : false
if (isMobile === true) {
return 'phone-normal'
}
return 'desktop-normal'
}
//////////////////////////////////////////////////////////////////////////////
......@@ -38,21 +38,21 @@ ARjs.Profile.prototype._guessPerformanceLabel = function() {
* reset all parameters
*/
ARjs.Profile.prototype.reset = function () {
this.sourceParameters = {
// to read from the webcam
sourceType : 'webcam',
}
this.contextParameters = {
cameraParametersUrl: '../../data/data/camera_para.dat',
detectionMode: 'mono',
}
this.defaultMarkerParameters = {
type : 'pattern',
patternUrl : '../../data/data/patt.hiro',
changeMatrixMode: 'modelViewMatrix',
}
return this
this.sourceParameters = {
// to read from the webcam
sourceType: 'webcam',
}
this.contextParameters = {
cameraParametersUrl: THREEx.ArToolkitContext.baseURL + '../data/data/camera_para.dat',
detectionMode: 'mono',
}
this.defaultMarkerParameters = {
type: 'pattern',
patternUrl: THREEx.ArToolkitContext.baseURL + '../data/data/patt.hiro',
changeMatrixMode: 'modelViewMatrix',
}
return this
};
//////////////////////////////////////////////////////////////////////////////
......@@ -61,36 +61,36 @@ ARjs.Profile.prototype.reset = function () {
ARjs.Profile.prototype.performance = function(label) {
ARjs.Profile.prototype.performance = function (label) {
if( label === 'default' ){
label = this._guessPerformanceLabel()
}
if (label === 'default') {
label = this._guessPerformanceLabel()
}
if( label === 'desktop-fast' ){
this.contextParameters.canvasWidth = 640*3
this.contextParameters.canvasHeight = 480*3
if (label === 'desktop-fast') {
this.contextParameters.canvasWidth = 640 * 3
this.contextParameters.canvasHeight = 480 * 3
this.contextParameters.maxDetectionRate = 30
}else if( label === 'desktop-normal' ){
this.contextParameters.canvasWidth = 640
this.contextParameters.canvasHeight = 480
this.contextParameters.maxDetectionRate = 30
} else if (label === 'desktop-normal') {
this.contextParameters.canvasWidth = 640
this.contextParameters.canvasHeight = 480
this.contextParameters.maxDetectionRate = 60
}else if( label === 'phone-normal' ){
this.contextParameters.canvasWidth = 80*4
this.contextParameters.canvasHeight = 60*4
this.contextParameters.maxDetectionRate = 60
} else if (label === 'phone-normal') {
this.contextParameters.canvasWidth = 80 * 4
this.contextParameters.canvasHeight = 60 * 4
this.contextParameters.maxDetectionRate = 30
}else if( label === 'phone-slow' ){
this.contextParameters.canvasWidth = 80*3
this.contextParameters.canvasHeight = 60*3
this.contextParameters.maxDetectionRate = 30
} else if (label === 'phone-slow') {
this.contextParameters.canvasWidth = 80 * 3
this.contextParameters.canvasHeight = 60 * 3
this.contextParameters.maxDetectionRate = 30
}else {
console.assert(false, 'unknonwn label '+label)
}
return this
this.contextParameters.maxDetectionRate = 30
} else {
console.assert(false, 'unknonwn label ' + label)
}
return this
}
//////////////////////////////////////////////////////////////////////////////
......@@ -99,78 +99,78 @@ ARjs.Profile.prototype.performance = function(label) {
ARjs.Profile.prototype.defaultMarker = function (trackingBackend) {
trackingBackend = trackingBackend || this.contextParameters.trackingBackend
if( trackingBackend === 'artoolkit' ){
this.contextParameters.detectionMode = 'mono'
this.defaultMarkerParameters.type = 'pattern'
this.defaultMarkerParameters.patternUrl = '../../data/data/patt.hiro'
}else if( trackingBackend === 'aruco' ){
this.contextParameters.detectionMode = 'mono'
this.defaultMarkerParameters.type = 'barcode'
this.defaultMarkerParameters.barcodeValue = 1001
}else if( trackingBackend === 'tango' ){
// FIXME temporary placeholder - to reevaluate later
this.defaultMarkerParameters.type = 'barcode'
this.defaultMarkerParameters.barcodeValue = 1001
}else console.assert(false)
return this
trackingBackend = trackingBackend || this.contextParameters.trackingBackend
if (trackingBackend === 'artoolkit') {
this.contextParameters.detectionMode = 'mono'
this.defaultMarkerParameters.type = 'pattern'
this.defaultMarkerParameters.patternUrl = THREEx.ArToolkitContext.baseURL + '../data/data/patt.hiro'
} else if (trackingBackend === 'aruco') {
this.contextParameters.detectionMode = 'mono'
this.defaultMarkerParameters.type = 'barcode'
this.defaultMarkerParameters.barcodeValue = 1001
} else if (trackingBackend === 'tango') {
// FIXME temporary placeholder - to reevaluate later
this.defaultMarkerParameters.type = 'barcode'
this.defaultMarkerParameters.barcodeValue = 1001
} else console.assert(false)
return this
}
//////////////////////////////////////////////////////////////////////////////
// Source
//////////////////////////////////////////////////////////////////////////////
ARjs.Profile.prototype.sourceWebcam = function () {
this.sourceParameters.sourceType = 'webcam'
delete this.sourceParameters.sourceUrl
return this
this.sourceParameters.sourceType = 'webcam'
delete this.sourceParameters.sourceUrl
return this
}
ARjs.Profile.prototype.sourceVideo = function (url) {
this.sourceParameters.sourceType = 'video'
this.sourceParameters.sourceUrl = url
return this
this.sourceParameters.sourceType = 'video'
this.sourceParameters.sourceUrl = url
return this
}
ARjs.Profile.prototype.sourceImage = function (url) {
this.sourceParameters.sourceType = 'image'
this.sourceParameters.sourceUrl = url
return this
this.sourceParameters.sourceType = 'image'
this.sourceParameters.sourceUrl = url
return this
}
//////////////////////////////////////////////////////////////////////////////
// trackingBackend
//////////////////////////////////////////////////////////////////////////////
ARjs.Profile.prototype.trackingBackend = function (trackingBackend) {
console.warn('stop profile.trackingBackend() obsolete function. use .trackingMethod instead')
this.contextParameters.trackingBackend = trackingBackend
return this
console.warn('stop profile.trackingBackend() obsolete function. use .trackingMethod instead')
this.contextParameters.trackingBackend = trackingBackend
return this
}
//////////////////////////////////////////////////////////////////////////////
// trackingBackend
//////////////////////////////////////////////////////////////////////////////
ARjs.Profile.prototype.changeMatrixMode = function (changeMatrixMode) {
this.defaultMarkerParameters.changeMatrixMode = changeMatrixMode
return this
this.defaultMarkerParameters.changeMatrixMode = changeMatrixMode
return this
}
//////////////////////////////////////////////////////////////////////////////
// trackingBackend
//////////////////////////////////////////////////////////////////////////////
ARjs.Profile.prototype.trackingMethod = function (trackingMethod) {
var data = ARjs.Utils.parseTrackingMethod(trackingMethod)
this.defaultMarkerParameters.markersAreaEnabled = data.markersAreaEnabled
this.contextParameters.trackingBackend = data.trackingBackend
return this
var data = ARjs.Utils.parseTrackingMethod(trackingMethod)
this.defaultMarkerParameters.markersAreaEnabled = data.markersAreaEnabled
this.contextParameters.trackingBackend = data.trackingBackend
return this
}
/**
* check if the profile is valid. Throw an exception is not valid
*/
ARjs.Profile.prototype.checkIfValid = function () {
if( this.contextParameters.trackingBackend === 'tango' ){
this.sourceImage('../../data/images/img.jpg')
}
return this
if (this.contextParameters.trackingBackend === 'tango') {
this.sourceImage(THREEx.ArToolkitContext.baseURL + '../data/images/img.jpg')
}
return this
}
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或