import * as THREE from "three";
import arnft from "arnft";
const { ARnft } = arnft;
import ARnftThreejs from "arnft-threejs";
const { SceneRendererTJS, NFTaddTJS } = ARnftThreejs;
let width = 640;
let height = 480;
ARnft.init(width, height, [["src/DataNFT/pinball"]], [["pinball"]], "config.json", true)
.then((nft) => {
console.log("nft", nft);
document.addEventListener("containerEvent", function (ev) {
let canvas = document.getElementById("canvas");
let fov = (0.8 * 180) / Math.PI;
let ratio = width / height;
let config = {
renderer: {
alpha: true,
antialias: true,
context: null,
precision: "mediump",
premultipliedAlpha: true,
stencil: true,
depth: true,
logarithmicDepthBuffer: true,
},
camera: {
fov: fov,
ratio: ratio,
near: 0.01,
far: 1000,
},
};
let sceneThreejs = new SceneRendererTJS(config, canvas, nft.uuid, true);
sceneThreejs.initRenderer();
let nftAddTJS = new NFTaddTJS(nft.uuid);
nftAddTJS.oef = true;
// Set width, height and width and height number of segments of the PlaneGeometry.
let imgConfig = { w: 1, h: 1, ws: 1, hs: 1 };
nftAddTJS.addVideo("arvideo", "pinball", 180, imgConfig, false);
const tick = () => {
sceneThreejs.draw();
window.requestAnimationFrame(tick);
};
tick();
});
window.addEventListener("nftTrackingLost-" + nft.uuid + "-" + "pinball", function (ev) {
//console.log(ev);
console.log("lost marker");
});
window.addEventListener("getMatrixGL_RH-" + nft.uuid + "-" + "pinball", function (ev) {
console.log("getMatrixGL_RH, Target found",ev);
});
})
.catch((error) => {
console.log(error);
});
I tried loooking into many similar issues posted here and tried to implement, but it didn't work for me or im making a error.
#155
#198
webarkit/jsartoolkitNFT#73
#11
The issue i face is this,
ScreenRecording_12-19-2024.12-46-29_1.mp4
I tried loooking into many similar issues posted here and tried to implement, but it didn't work for me or im making a error.
#155
#198
webarkit/jsartoolkitNFT#73
#11
Can you please guide me on how to solve this issue?