Three.js is not a representation of an object within the THREE.Object3D framework

Can you assist me with this issue? Below is the pertinent information:

c9:

or (http://) zixxus-github-io-zixxus.c9.io/

and git:

https://github.com/zixxus/zixxus.github.io.git

Myconsole:

"THREE.WebGLRenderer" "69" three.js:17679
"THREE.WebGLRenderer: .setClearColorHex() is being removed. Use .setClearColor() instead." three.js:18158
"THREE.Object3D.add:" Object { uuid: "648CCB0D-90E4-4E8B-A464-26AA086638FF", name: "", type: "Geometry", vertices: Array[8], colors: Array[0], faces: Array[12], faceVertexUvs: Array[1], morphTargets: Array[0], morphColors: Array[0], morphNormals: Array[0], 19 more… } "is not an instance of THREE.Object3D." three.js:7562

  1. It seems like I am unable to reload the 3D object, do you know why? :(

  2. If I succeed in loading the August 3D object, will I be able to move it to a specific location upon impact?

I have been trying to export objects from Blender to Three.js or .obj format, but without success. I even attempted to use the editor from here: (http://) threejs.org/editor/

Edit

javascriptthree.js

Answer №1

As far as I know, the callback function for JSONLoader receives a geometry object, which means you will need to create a mesh using that object.

var loader = new THREE.JSONLoader();
loader.load('js/model/untitled.json', function(object){

    scene.add(new THREE.Mesh(object));

});

I haven't personally tested this method yet, so proceed with caution.

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

Updating item information within an array in Vue.js

I'm currently working on integrating an edit feature into a task application using Vue JS. My issue lies in the fact that I have a click event assigned to the edit button - @click="editShow" which displays input fields for editing all items instead ...

javascriptarraysvue.jsvuejs2

Discovering ways to enhance time multiplication with JavaScript

My MVC model provides me with a timespan like this: timeTaken = "00:01:00"; Along with a multiplier value of multiply = "3"; The end result should be 00:03:00 What would be the most efficient way to calculate this time? I'm not well-versed in ...

javascriptjqueryasp.net-mvc

Styles in NEXT.js are not loading properly due to issues with the Module

I have been attempting to apply module.css to one of my components by following the instructions provided in this tutorial https://nextjs.org/learn/basics/assets-metadata-css/layout-component. /*/components/Livestream/App.js*/ import styles from './A ...

javascriptcssreactjssassnext.js

The scrolling action triggered by el.scrollIntoViewIfNeeded() goes way past the top boundary

el.scrollIntoViewIfNeeded() function is used to scroll to element el if it's not within the visible browser area. Although it generally works well, I have encountered some issues when trying to use it with a fixed header. I have provided an example s ...

javascripthtmlcssscroll

The functionality of the Firebase Realtime Database has ceased

After successfully developing an app with Firebase's Real-time Database for the past month, I suddenly encountered an issue today. Despite the authentication features working seamlessly, my app is no longer able to retrieve data from Firebase. It&apos ...

javascriptfirebasereact-nativefirebase-realtime-database

Attaching this to the event listener in React JS

After delving into a beginner's guide on React JS, I encountered a slight hiccup. The issue revolves around a simple problem within the button element; specifically, an event handler that requires passing an argument. This handler serves the purpose o ...

javascriptreactjsecmascript-6

What could be the reason these two functions yield different outcomes?

I am currently in the process of optimizing a function to enhance performance. Previously, the old function took approximately 32 seconds, while the new one now only takes around 350 milliseconds for the same call. However, there seems to be an issue as th ...

javascriptnode.jsmongodbexpressmongoose

setting the minimum date for a datepicker

Does anyone know how to set the minimum date for a calendar to be 2 days from the current date? For example, if today is the 27th, the minimum date should be the 29th. Any suggestions? Thanks. https://i.sstatic.net/7yHhH.png #html code <mat-form-field ...

javascriptangulartypescript

Tips for managing numerous Axios requests in JavaScript

I have a scenario where I need to send 3 axios calls simultaneously from the frontend to the backend using the axios.all function to modify a MONGO DB database. The challenge I am facing is ensuring that if one of the requests fails, none of the other requ ...

javascriptnode.jsreactjsaxiosconcurrency

The submission process continues to load indefinitely without displaying any data

I have set up a donation form where the user can submit their donation. The issue I am facing is that, although the data is being updated in the backend and stored in the database correctly, the AJAX request is not receiving the return data. I have a loade ...

javascriptphpjqueryajaxcodeigniter

How can I trigger a function again when an anchor link is clicked and received via Ajax?

I am currently working on creating a unique page transition effect using jQuery and Ajax. This is what I have so far: $(".transitionLink").on("click", function (event) { event.preventDefault(); var href = $(this).attr("href"); window.histor ...

javascriptjqueryajax

Utilizing the setNetWorkConditions function in webdriverjs for Chrome

Is there a way to properly utilize the webdriverjs setNetworkConditions() method as outlined in the official documentation? This is what my code looks like: const chromeCapabilities = webdriver.Capabilities.chrome() const chromeOptions = { ...

javascriptseleniumselenium-webdriverwebdriver

tips for adding text to an input field after it has been submitted

Is there a way to automatically add text to an input field after the user has entered their information? For example, if a user types "youtube.com" into a search bar, could the input then apply ""? ...

javascripthtml

Learn how to properly implement cookies in a fetch request within Nextjs

Here is a code snippet to consider: Index.getInitialProps = async function({req}) { const res = await fetch("http://localhost/api/tiles"); const json = await res.json(); } If the /api/tiles endpoint requires access to the uid cookie from the user, t ...

javascriptreactjscookiesnext.jsreact-cookie

The function has exceeded the time limit of 60000 milliseconds. Please make sure that the callback is completed

Exploring the capabilities of Cucumber with Protractor has been an intriguing journey for me. As I delved into creating a feature in Gherkin language, outlining the steps and scenarios necessary for my end-to-end tests, a new world of possibilities opened ...

javascripthtmlangularcucumber

What is the best way to integrate JavaScript into an Express Handlebars template using partials?

In my current project, I have utilized the following handlebars template (located under views/layouts/main.handlebars): <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>{{title}}</title> ...

javascriptnode.jsexpresshandlebars.jsexpress-handlebars

Obtain the height and width of the original images from the href and assign them to your attributes using jQuery

Hey there pals, I'm currently on a mission to fetch the dimensions (height and width) of an image from a hyperlink and then insert those values into its attribute. This task has got me going bonkers! Here's my snippet: <figure> <a ...

javascripthtmljqueryeachloadimage

When you click on a sublevel in the vertical CSS and JavaScript onclick menu, it disappears automatically

I'm a beginner when it comes to Javascript, and I'm still getting the hang of CSS/HTML. Currently, I am working on creating a vertical menu using CSS and javascript. My goal is to have the sublevels appear on the right side of the menu when someo ...

javascripthtmlcssdrop-down-menumenu

Currently focused on developing vertical sliders that can be manipulated by dragging them up or down independently

https://i.stack.imgur.com/NgOKs.jpg# I am currently working on vertical sliders that require dragging up and down individually. However, when I pull on the first slider, all sliders move together. The resetAllSliders button should also work independently, ...

javascriptangulartypescriptangular8angular12

Use jQuery to submit a form only after confirming its validity using ajax

I've come across an interesting challenge in a form I'm working on. There's one field that requires server-side validation, so I need to capture the submission, send an AJAX request with the field data, check the result, and either allow the ...

javascriptjqueryajaxvalidationsubmit