I am new to javascript and i am trying to call the create function listed below and keep on getting the same error which is object [object Object] is not a function in javascript Can anyone please help.
// This is just a sample script. Paste your real code (javascript or HTML) here.
function init() {
//Marker
canvasMarker = document.createElement('canvas');
context = canvasMarker.getContext('2d');
container = document.createElement('div');
document.body.appendChild(container);
document.body.appendChild(canvasMarker);
/* This is where ths problem is encountered. */
detector = create(canvasMarker);
camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 1000);
camera.position.set(80, 20, 10);
//Creates scene
scene = new THREE.Scene();
var ambient = new THREE.AmbientLight(0x101030);
//scene.add(ambient);
var directionalLight = new THREE.DirectionalLight(0xffeedd);
directionalLight.position.set(0, 0, 1);
scene.add(directionalLight);
// loads texture
var manager = new THREE.LoadingManager();
manager.onProgress = function (item, loaded, total) {
console.log(item, loaded, total);
};
var texture = new THREE.Texture();
var loader = new THREE.ImageLoader(manager);
loader.load(texturePath, function (image) {
texture.image = image;
texture.needsUpdate = true;
texture.transparent = true;
});
// loads model
var loader = new THREE.OBJLoader(manager);
loader.load(objectPath, function (object) {
object.traverse(function (child) {
if (child instanceof THREE.Mesh) {
child.material.map = texture;
child.material.transparent = true;
}
});
object.position.y = -100;
scene.add(object);
});
//setup three.js renderer
renderer = new THREE.WebGLRenderer({
alpha: true
});
//canvas
var mycanvas = renderer.domElement;
mycanvas.setAttribute('id', 'Canvas3d');
renderer.setSize(window.innerWidth, window.innerHeight);
container.appendChild(mycanvas);
document.addEventListener('mousemove', onDocumentMouseMove, false);
//window listener for resize
window.addEventListener('resize', onWindowResize, false);
video = document.getElementById('myvideo');
}
function onWindowResize() {
windowHalfX = window.innerWidth / 2;
windowHalfY = window.innerHeight / 2;
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize(window.innerWidth, window.innerHeight);
}
function onDocumentMouseMove(event) {
mouseX = (event.clientX - windowHalfX) / 2;
mouseY = (event.clientY - windowHalfY) / 2;
}
//Animate the model
function animate() {
// The ardetector requires that we set a flag when the canvas has changed.
canvasMarker.changed = true;
// Ask the detector to make a detection pass.
detector.detect(onMarkerCreated, onMarkerUpdated, onMarkerDestroyed);
requestAnimationFrame(animate);
render();
}
//Render the Model
function render() {
camera.position.x += (mouseX - camera.position.x) * .05;
camera.position.y += (-mouseY - camera.position.y) * .05;
camera.lookAt(scene.position);
renderer.render(scene, camera);
}
*
var create = function (sourceCanvas) { *
var JSARRaster = new NyARRgbRaster_Canvas2D(sourceCanvas);
var JSARParameters = new FLARParam(sourceCanvas.width, sourceCanvas.height);
var JSARDetector = new FLARMultiIdMarkerDetector(JSARParameters, 120);
JSARDetector.setContinueMode(true);
var getMarkerNumber = function (idx) {
var data = JSARDetector.getIdMarkerData(idx);
if (data.packetLength > 4) {
return -1;
}
var result = 0;
for (var i = 0; i < data.packetLength; i++) {
result = (result << 8) | data.getPacketData(i);
}
return result;
}
var getTransformMatrix = function (idx) {
var mat = new NyARTransMatResult();
JSARDetector.getTransformMatrix(idx, mat);
var cm = new Float32Array(16);
cm[0] = mat.m00;
cm[1] = -mat.m10;
cm[2] = mat.m20;
cm[3] = 0;
cm[4] = mat.m01;
cm[5] = -mat.m11;
cm[6] = mat.m21;
cm[7] = 0;
cm[8] = -mat.m02;
cm[9] = mat.m12;
cm[10] = -mat.m22;
cm[11] = 0;
cm[12] = mat.m03;
cm[13] = -mat.m13;
cm[14] = mat.m23;
cm[15] = 1;
return cm;
}
var getCameraMatrix = function (zNear, zFar) {
var result = new Float32Array(16);
JSARParameters.copyCameraMatrix(result, zNear, zFar);
return result;
}
var persistTime = 1;
var newMarker = function (id, matrix) {
return {
id: id,
matrix: matrix,
age: persistTime,
}
}
var markers = {};
var detect = function (onCreate, onUpdate, onDestroy) {
var markerCount = JSARDetector.detectMarkerLite(JSARRaster, 70);
for (var index = 0; index < markerCount; index++) {
var id = getMarkerNumber(index);
var marker = markers[id];
if (marker === undefined) {
marker = newMarker(id, getTransformMatrix(index));
markers[id] = marker;
onCreate(marker);
} else {
marker.matrix = getTransformMatrix(index);
marker.age = persistTime;
onUpdate(marker);
}
}
for (var id in markers) {
var marker = markers[id];
if (marker) {
if (marker.age-- == 0) {
onDestroy(marker);
delete markers[id];
}
}
}
}
return {
detect: detect,
getCameraMatrix: getCameraMatrix,
}
}
return {
create: create,
}
This is my code. Please help.
See Question&Answers more detail:
os 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…