I am trying to use the unlimited image target to activate 6 models, I have dissable disableworldtracking and turned off the auto load but don’t get the model to load. So I am trying the unlimited image target to activate it, I have added the assets in the body, and to test it out and it is not working. How can I activate the 6th image, I know 8thwall allows for up to ten images to scan when disableworldtracking: true, but can’t seem to get it to work. I’ll add my code for how I have it set up right now. What is the best solution to get 6 targets to load 6 gltf models?
config target
const configTargetsComponent = {
schema: {
targets: {type: 'array', default: ['']},
},
ensureImageTargetsConfigured() {
if (this.configured || !this.configOk) {
return
}
// console.log(`Scanning for targets: ${JSON.stringify(this.data.targets)}`)
XR8.XrController.configure({imageTargets: this.data.targets})
this.configured = true
},
init() {
this.configured = false
this.configOk = false
this.el.sceneEl.addEventListener('realityready', () => {
this.configOk = true
this.ensureImageTargetsConfigured()
})
},
update() {
this.configured = false
this.ensureImageTargetsConfigured()
},
}
const panicComponent = {
init() {
const targets = ['david', 'lena', 'jazmin2', 'tarrahkitch', 'igliid', 'MayaMarker']
const found = []
let active
const remainder = targets.length % 10
let i = 0
const updateImageTargets = () => {
const notFound = targets.filter(target => !found.includes(target))
if (i + 10 + remainder === targets.length) {
notFound.splice(i, remainder)
} else {
notFound.splice(i, 10)
}
notFound.splice(10 - found.length)
active = [...found, ...notFound]
this.el.sceneEl.setAttribute('config-targets', `targets: ${active}`)
if (i + remainder === targets.length) {
i = 0
} else {
i += 10
}
}
this.el.addEventListener('xrimagefound', ({detail}) => {
found.push(detail.name)
})
this.el.addEventListener('xrimagelost', ({detail}) => {
found.splice(found.indexOf(detail.name), 1)
})
// update active image targets every second
setInterval(updateImageTargets, 1000)
},
}
export {configTargetsComponent, panicComponent}
Body
<a-scene
xrextras-gesture-detector
landing-page
xrextras-loading
xrextras-runtime-error
panic-mode
config-targets="david, lena, jazmin2, tarrahkitch, igliid, MayaMarker"
renderer="colorManagement:true; webgl2: true;"
xrweb="disableWorldTracking: true">
//Maya Assets
<a-assets>
<img id="trail" src="assets/Maya/MayaMapMarker.jpg" />
<video
id="manzanar"
autoplay
muted
crossorigin="anonymous"
loop="true"
src="assets/Maya/manzanartrail.mp4"></video>
</a-assets>
//End Maya Assets
//Igli Assets
<a-assets>
<a-asset-item id="idigli" src="assets/Igli/Igli_ID.glb"></a-asset-item>
<img id="idpopup" src="assets/Igli/igliid.jpg" />
</a-assets>
<a-assets>
<a-asset-item id="iglitxt" src="assets/Igli/Igli_Text.glb"></a-asset-item>
<img id="idpopup" src="assets/Igli/igliid.jpg" />
</a-assets>
// End Igli Asstes
// tarrah assets
<a-assets>
<a-asset-item id="tarrahfish" src="assets/Tarrah/TarrahFinalFish1.glb"></a-asset-item>
<img id="kitchen" src="assets/Tarrah/tarrahkitchen.jpg" />
</a-assets>
//End Tarrah Assets
//Jazmin Assets
<a-assets>
<a-asset-item id="jazaltar" src="assets/jazmin/jazmodel.glb"></a-asset-item>
<a-asset-item id="jazvid" src="assets/jazmin/jazmin2.glb"></a-asset-item>
<img id="altar" src="assets/jazmin/Jazmin2.jpg" />
<video
id="altarvid"
muted
autoplay="true"
loop="true"
crossorigin="anonymous"
src="assets/jazmin/JazminRelocation.mp4"></video>
</a-assets>
//End Jazmin Assets
//Lena Assets
<a-assets>
<a-asset-item id="lenatree" src="assets/Lena/LenaTreeFinal2.glb"></a-asset-item>
<img id="tree" src="assets/Lena/IMG_1392.jpg" />
</a-assets>
//End Lena Assets
//David Assets
<a-assets>
<a-asset-item id="wall" src="assets/David/dav2.glb"></a-asset-item>
<img id="wallpics" src="assets/David/david.jpeg" />
</a-assets>
//Camera & Scene Lighting
<a-camera position="0 4 10" raycaster="objects: .cantap" cursor="fuse: false; rayOrigin: mouse;">
</a-camera>
<a-light type="directional" intensity="0.5" position="1 1 1"></a-light>
<a-light type="ambient" intensity="0.7"></a-light>
//End Scene
//maya model
<!-- Note: "name:" must be set to the name of the image target uploaded to the 8th Wall Console -->
<xrextras-named-image-target name="MayaMarker">
<a-entity
xrextras-play-video="video: #manzanar; thumb: #jelly-thumb"
geometry="primitive: plane; height: 3; width: 1.5"
position="0 -0.6 0"></a-entity>
</xrextras-named-image-target>
//end maya model
//igli model
<!-- Note: "name:" must be set to the name of the image target uploaded to the 8th Wall Console -->
<a-entity xrextras-named-image-target name="igliid">
<!-- Add a child entity that can be rotated independently of the image target. -->
<xrextras-one-finger-rotate gltf-model="#idigli"
xrextras-one-finger-rotate gltf-model="#iglitxt"
position="0 -0.6 0"></a-entity>
<!--
<a-entity xrextras-one-finger-rotate gltf-model="#iglitxt"
position="0 -0.6 0"
animation-mixer=></a-entity>
</a-entity>
</xrextras-named-image-target> -->
//end igli model
//tarrah model
<xrextras-named-image-target name="tarrahkitch">
<a-entity xrextras-one-finger-rotate gltf-model="#tarrahfish"
animation-mixer
position="0 -0.6 0"
scale="0.2 0.2 0.2"></a-entity>
</xrextras-named-image-target>
//end tarrah model
//jazmin model
<xrextras-named-image-target name="Jazmin2">
<a-entity xrextras-one-finger-rotate gltf-model="#jazaltar"
animation-mixer
position="0 -0.6 0"
scale="0.2 0.2 0.2"
></a-entity>
</xrextras-named-image-target>
//end jazmin model
//Lena model
<xrextras-named-image-target name="lena">
<a-entity xrextras-one-finger-rotate gltf-model="#lenatree"
animation-mixer
position="0 -0.6 0"
></a-entity>
</xrextras-named-image-target>
//end Lena model
//David model
<xrextras-named-image-target name="david">
<a-entity xrextras-one-finger-rotate gltf-model="#wall"
animation-mixer
position="0 0 0"
scale="1 1 1"
rotation="0 2 0">
</a-entity>
</xrextras-named-image-target>
//end David model
</a-scene>