Why am I getting the error message "fromArray is not a function" in Three.js, Threex, and Javascript?

I've been putting in a lot of effort to figure this out on my own, but I'm completely new to three.js and javascript, and I really need some assistance.

My goal is to import a model from threex into my three.js scene. However, when I try to add the code for it like this:

    var spaceship = null;
THREEx.SpaceShips.loadSpaceFighter03(function(object3d){
    scene.add(object3d)
    spaceship = object3d
})

All I get is a blank scene and an error in my console:

Uncaught TypeError: (intermediate value).fromArray is not a function.:8000/bower_components/threex.spaceships/examples/vendor/three.js/examples/js/loaders/MTLLoader.js:299

This points me towards a line of code in MTLLoader.js that seems to be causing the issue.

params[ 'ambient' ] = new THREE.Color().fromArray( value );

I'm feeling a bit lost and overwhelmed. Can someone please help me troubleshoot this?

I am following this tutorial: https://www.youtube.com/watch?v=vw5_YyM4hn8 (I have also referenced the sample code here: https://github.com/jeromeetienne/flying-spaceship-minigame/blob/master/step1-01-naked-spaceship.html, but have not been able to resolve the issue.)

Thank you for any help you can provide.

javascriptthree.js

Answer №1

There seems to be a compatibility issue between the current version of three.js and the code from threex. Threex is designed to work with an older version of three.js that is about a year old.

For those learning three.js, one helpful resource is Learning WebGL and three.js

You can find the specific version of three.js that threex uses at https://github.com/jeromeetienne/threex/tree/master/vendor

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

What is the method for displaying cities from a JavaScript array using zip codes?

Hey there! I'm currently working on a feature that involves taking user input for zip codes and triggering the "key up" event to populate available stores and cities in that area. Below is a snippet of the code I've been using: delivery.componen ...

javascriptangulartypescriptzipcode

When implementing $().html, certain impacts of mdui may fade away

I've been exploring the functionalities provided by mdui.org, specifically the panel feature. Initially, I had successfully integrated the codes into the HTML body with no issues. View the code here See the screen capture here This allowed me to to ...

javascriptjqueryhtmlcssfrontend

Enhancing XTemplate in ExtJS 4.2.1 with dynamic data refresh from store

Here's a situation that's quite unique... A DataView linked to a store is causing me some trouble. In the XTemplate, I want to display the quantity of a specific type of JSON record. Each record has a 'type' property with a value. For ...

javascriptjsonextjs

Using EJS variables within script tags to assign an array to a variable results in converting the array into

When I needed to pass a variable to the script tag in the EJS file, I used the question array (which I inexplicably called object in the variable name) that I had to work with. This was achieved by using '<%-varname%>'. However, my goal was ...

javascriptnode.jsarraysvariablesejs

Running into memory issues while constructing the heap

After attempting to build and deploy our React application, I encountered the following error: FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory While I initially thought this was solely a JavaScript issue, I am uncert ...

javascriptreactjs

capturing webpage content with javascript for use in a screenshot

Is there a way to capture a screenshot of a webpage using JavaScript and utilize the canvas tag for this purpose? I attempted to use the html2canvas plugin in the past, but found it lacking in power. I would like to achieve this without relying on extern ...

javascriptjqueryhtmlcanvaswebpage-screenshot

Basic exam but located in a place that is not valid

Here is a test I am working on: // import {by, element, browser} from "protractor"; describe('intro', () => { beforeEach(() => { browser.get(''); }); it('should have multiple pages', () => { let buttonOn ...

javascriptnode.jsseleniumtypescriptprotractor

When invoking an external API within a Firebase Cloud Function, it may result in a

I've been attempting to use a basic API for currency conversion within a Firebase Cloud Function written in Typescript, but I keep getting a 'null' response. import { https } from 'firebase-functions'; import * as axios from ' ...

javascriptnode.jstypescriptfirebasegoogle-cloud-functions

Fetch data from an API using JavaScript and load a JSON file

I'm currently facing an issue with this specific problem: I am attempting to retrieve the JSON file from using the following code: $("document").ready(function () { // Triggering function reLoad(); function reLoad() { $.getJSON( ...

javascriptjsonapiget

React-dnd supporting multiple draggable and droppable elements

I am facing a challenge with making multiple elements draggable using react-dnd. I have an array of 4 fields that I would like to make draggable, but when I map through the array and give each element a className of 'element', they do not move as ...

javascriptarraysreactjsreact-dnd

Modifying Data with MomentJS when Saving to Different Variable

After attempting to assign a moment to a new variable, I noticed that the value changes on its own without any modification from my end. Despite various attempts such as forcing the use of UTC and adjusting timezones, the value continues to change unexpec ...

javascriptangulartypescriptmomentjs

Ensure that text is aligned alongside an image only when both elements are enclosed within <p> tags

When using an API to pull markdown content from Contentful and converting it to HTML with ReactMarkdown, a common issue arises. The resulting HTML structure often places the text content in separate paragraphs such as: <p>Some text content</p> ...

javascriptreactjsmarkdown

Creating a React functional component that updates state when a specific window breakpoint is reached

Having an issue with my code when it hits the 960px breakpoint. Instead of triggering once, it's firing multiple times causing unexpected behavior. Can someone help me troubleshoot this problem? const mediaQuery = '(max-width: 960px)'; con ...

javascriptreactjsreact-functional-component

Is there a way to incorporate vue samples into an independent HTML document?

Striving to broaden my knowledge of Vue, I set out to create a page with tabs inspired by one of the Vue examples available at . However, an obvious error seems to be eluding me, as I encounter a syntax issue on the line import * as Tabs from 'vue-s ...

javascriptvue.js

Having trouble getting jQuery(this) to work with qtip?

I am currently working with jQuery's qtip plugin to display a hidden value upon hovering over icons that are already rendered. However, I am running into an issue where only the first item in the list is being displayed in the qtip. I have tried using ...

javascriptjqueryapiqtip

Retrieving the event name from a CustomEvent instance

Looking to retrieve the name of a CustomEvent parameter in a function, which is basically the string it was created with (new CustomEvent('foo')) If you need a reference, check out https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent ...

javascripttypescript

Encode a variable into base64 using the Buffer module in node.js

Attempting to convert a variable from an HTTP parameter to base64 using node.js and Buffer. Code snippet: var http = require("http"); var url = require("url"); http.createServer(function(req, res) { var parsedUrl = url.parse(req.url, true); var que ...

javascriptnode.jsbuffer

I ran into an issue trying to modify the color and thickness of the divider line in MaterialUI

Check out my code on codesandbox here. I'm trying to adjust the line thickness and color of the separator in my MaterialUI project, but I'm having trouble getting it to work. I've looked at a few examples, but nothing seems to be working for ...

javascriptcssreactjsmaterial-ui

Animate items in a list by staggering their appearance during the initial rendering

I am currently working on creating a navigation menu that has a staggered effect when the list items appear upon opening the menu. Using a burger symbol to toggle the navigation menu to fullscreen, I want to incorporate an animation where each list item ( ...

javascriptcssvue.jsvuejs2transition

Issue with jQuery 'on' event not triggering following 'load' event

I am facing an issue on a page where similar events occur but when new content is loaded halfway through, most of the jQuery functionalities stop working. The scenario involves answering questions in a 'game' format using AJAX calls. Once all que ...

javascriptphpjqueryhtmlajax