"Error in Three.js: The object being added must be an instance of THREE.Object3D, not a Vector3. Where is this error coming from and

I've been struggling with this code, attempting to create a spinning cube but encountering numerous errors. Here is my code from camera.js and scene.js:

import * as THREE from "three";

export function createCamera(gameWindow) {
  // Camera settings
}

// More code

export function createScene() {
  // Scene setup
}

When I tried to run the code, instead of getting a cube that can be panned, zoomed, and rotated, I received an error as described in the title. The cube remained stationary, and I'm puzzled as to why the error occurred and where it originated. My understanding of three.js is limited, and I'm seeking guidance on resolving this issue.

Answer №1

Let's address the issue at hand: camera.add(cameraOrigin);

The add method is expecting an Object3D, but you are providing a Vector3 (

cameraOrigin = new THREE.Vector3();
), which is causing the error. To set a position for your object, consider using .position instead

For further clarification, here is some documentation: https://threejs.org/docs/#api/en/core/Object3D.position

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How can I dynamically update HTML content in React upon receiving an AJAX response?

Hi there, I'm new to using React and I have a requirement where I need to make an AJAX GET request to the server when a user clicks on a button. Based on the received response, I need to prepare HTML and display it. I tried implementing this with the ...

Exploring Iconography in Amcharts

Is there a simple way to include images/icons within a chart using x and y coordinates? I'm new to javascript and amcharts (am4charts) so any assistance would be greatly appreciated! I've searched for solutions on stackoverflow, like this one o ...

In Ruby on Rails, ensure to trigger the ajax:beforeSend and ajax:complete events when using the link_to method with the remote

I'm currently developing a web app using Ruby on Rails as the framework. We have been utilizing the link_to method with remote true for all partial renders, following instructions provided in this helpful resource. However, I am looking to associate t ...

Navigating to a destination with react-leaflet: step-by-step guide

As a newcomer to React and Leaflet, I am trying to create a feature where users can input coordinates, trigger an event on pressing enter, and then have the map fly to those generated coordinates. I am successfully generating the latitude and longitude coo ...

What is the best approach for dynamically accessing or rendering Children within an Angular Component?

I am facing an issue with reusing a component called wrapper with different child components. I found some helpful resources such as this SO question and this article. However, these only address cases where the child component is known in advance. In my s ...

The Angular.js resource REST request encountered a TypeError due to a function being undefined

My goal is to update data using a REST call. I have already made a GET request to populate the form, and upon clicking the update button, I intend to initiate a PUT call. However, instead of successfully executing the PUT call, I encounter a Type Error. B ...

What is the best way to incorporate a particular locale from AngularJS I18n files with bower?

After successfully downloading the angular I18n repo by using bower install angular-i18n, it is now located in my bower_components directory and has updated the bower.json file with angular-i18n : 1.5.3 as expected. However, I am facing an issue where a s ...

Using Jquery to Redirect Users According to URL Position

My current dilemma involves... I want to create a condition where if the URL specifically contains /foldername/index.htm or /foldername/ on mydomain.com, then it should redirect to http://www.example.com If the URL includes any URL parameter with /folder ...

Turn off the scroll bar and mouse wheel functionality, while still allowing for scrolling

Is there a way to hide scrollbars on a website, prevent scrolling by mouse but still allow access to hidden areas using the jQuery scrollTo plugin function? (e.g. clicking on a button to scroll to a specific element) Thank you! ...

Transform specific data binding values into JSON format using Knockout.js

Just dipping my toes into the world of knockoutjs, I've got this viewmodel set up: var Testing = function(){ this.Username = ko.observable(""); this.Password = ko.observable(""); this.email = ko.observable(""); } I'm tasked with ...

Creating a dedicated subfolder for 4 REST API routes for better organization

I'm struggling to figure out why my .get('/:post_id') route isn't working... My project's folder structure looks like this: app.js routes --api ----blog.js The blog.js file is located in the routes/api folder. In app.js, I&apo ...

Error encountered with the NextGen (Mirth) Connect and MongoDB Java driver connection

I'm currently in the process of setting up Mirth Connect Server 3.10.1 (Java version: 1.8.0_181) to write FHIR JSON documents to MongoDB. Following the instructions provided in this post, I have included the following drivers in my custom-lib/ directo ...

Why does Vue.js struggle to update a value once it has been initially set using $refs?

Why won't the title update after the callback function finishes running or when I click on the Change title button? This is an exercise taken from a VueJS course on Udemy that seems to work perfectly in the tutorial video, but for some reason, I can& ...

Monitoring all changes with AngularJS in the ng-init function

When working with an AngularJS controller, I set some variables on the server side using ng-init. /* Setting variables in server side View */ <div ng-controller="myController" ng-init="myFoo=@myFoo;myBar=@myBar">...</div> /* Controller logic ...

Steps to creating a dynamic transformation of an INPUT field into a TEXTAREA within a Bootstrap4/jQuery web application

I'm curious about a way to have an INPUT field automatically transform into a TEXTAREA in the browser under specific conditions, such as the length of the text within it. Is there a method to achieve this without needing additional logic on the server ...

Tips for patiently waiting for a promise to be fulfilled

Currently, I am faced with a scenario in a NodeJs framework where a specific function must be synchronous, yet I need to access a value asynchronously. Ideally, I would be able to return a promise, however, that is not feasible. To address this issue quic ...

What is the method for determining the length of a string in JavaScript?

I'm in the process of developing a calculator that can compute the values within a string. To achieve this, I've implemented a Function object, but upon execution of the code, I encounter an issue where I receive a result of 'undefined' ...

How to ensure unique results when using DFS for Combination Sum?

I am currently tackling the challenge of solving LeetCode #49 Combination Sum. The objective here is to identify all the distinct combinations that add up to the specified target. While it's relatively straightforward to find permutations that result ...

Error encountered in Node.js/Express: Unable to render the 'title' parameter

Currently, I am diving into the world of Node.js by following along with Sam's "Node.js in 24 Hours" book. Chapter 8 has proven to be quite challenging for me, taking more than an hour to grasp! Example 07 in this chapter guides the programmer on crea ...

Trouble getting CSS to load in Webpack

I'm having some trouble setting up Webpack for the first time and I think I might be overlooking something. My goal is to use Webpack's ExtractTextPlugin to generate a CSS file in the "dist" folder, but it seems that Webpack isn't recognizi ...