The power duo of Three.js and OrbitControl gang up to

Is this a pure javascript mistake or something else? I attached an eventListener in the class function below and received this error:

Uncaught TypeError: Cannot read property 'call' of undefined

I want to clarify that all the functions being called are properly defined.

function OrbitController(v){
var that = this;
this.view = v;
this.controls = new THREE.OrbitControls(this.view.getCamera(),this.view.renderer.domElement);
this.controls.addEventListener( 'change', that.view.show());// Uncaught TypeError: Cannot read property 'call' of undefined
this.controls.target = new THREE.Vector3(0, 0, 0);
}

Answer №1

Here is a solution you can try:

Add this code snippet to your controls event listener: 
this.controls.addEventListener( 'change',  function(){ that.view.show()});

Answer №2

Only if that.view.show() produces a function, it should be

this.controls.addEventListener( 'change', that.view.show ); 

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

Design a search page with expandable fields for a user-friendly experience

Initially, my search page displays 12 fields. I would like to add a link labeled "MORE" that will reveal an additional 10 fields, including the original ones. If the user clicks on "HIDE," these extra 10 fields will disappear as well. ...

If I reload or close my page immediately after sending an asynchronous Ajax request to the server, will the request still be completed?

Suppose I use jQuery's Ajax to make the following request: $(document).ready(function() { $('#some_button').click(function() { $.ajax({ url: '/some/request', type: 'POST', ...

kineticjs equivalent to jquery sortable

Could someone recommend a kineticjs plugin or script that works with jquery's "sortable" function? I am trying to create a list of shapes where I can drag and drop them, and when one element moves, the other elements shift into place. ...

Adjusting the height of a GAS iframe in WordPress with iframe-resizer: A step-by-step guide

I would like to embed an iframe of my Google Application Script Web into my WordPress site without the scroll bar. Refer to the image below for context. https://i.stack.imgur.com/7L6Tw.png I encountered an error message while attempting to use the iframe ...

How can I turn off shadows for every component?

Is it feasible to deactivate shadows and elevation on all components using a configuration setting? ...

These specific resources don't have a cache expiration set. Wondering how to properly set a cache expiration for a JavaScript file

I am working on a web application that utilizes external JavaScript files. Upon running Google's page speed tool, I realized that several resources are missing cache expiration settings, including images and CSS files. Can you provide examples of how ...

Displaying an 'undefined' message in a JavaScript alert box

Hello! Just made the switch from C#/C++ to JavaScript recently and I'm really enjoying it. I've encountered a behavior that has me scratching my head, can anyone help explain? So here's what's happening: when I run this script, I see ...

PhantomJs is only providing partial responses

I have been attempting to retrieve a response from the following URL using PhantomJS:- https://www.trivago.com/api/v1/bin/accommodation/2891353/deals?iPathId=34812&iRoomType=1&aRooms=&aDateRange%5Barr%5D=2017-05-24&aDateRange%5Bdep%5D=2017 ...

Achieving the functionality of toggling a div's visibility using jQuery by simply clicking on a

Here is the JavaScript code I am using: $(document).ready(function() { $('.LoginContainer').hide(); $('.list li a').click(function(){ $('.LoginContainer').togg ...

Performing simultaneous AJAX requests in Javascript and jQuery

function makeCall(file, handlerFile, sendMethod, formData) { //console.log(instance.files); $.ajax({ url: handlerFile, type: sendMethod, xhr: function() { // Custom XMLHttpRequest var xhr = $.ajaxSettings.xhr() ...

Tips on preventing hardcoded, chained asynchronous functions in JavaScript/jQuery

In my program, almost all functions involve asynchronous calls that rely on the results of previous functions. To manage this, I've hard-coded each subsequent function call within the success callback of the preceding one: function getStuff() { $ ...

Ways to load an alternate view upon redirection and initiate button submission

Currently working with MVC/ASP.NET I'm in a situation where I have two distinct views. One of them is responsible for showing a list of items based on a group ID, while the other page is tasked with displaying a variety of information that is generat ...

Items on the list gradually disappear when scrolling

I am currently managing a group of list items using "Next" and "Prev" buttons. The code displays five list items at a time, and by clicking "Next" or "Prev", you can navigate to view another set of five items. It's a straightforward operation that fun ...

Assigning a variable following a triumphant ajax request

When working with Java, you have the ability to reference an outer class by mentioning its name followed by this keyword. class A { void A() { } class B { void B() { A.this.A(); } } } Now, I'm trying to a ...

Altering the guardians of a three-dimensional model without compromising its original placement

I am currently utilizing the three.js library for handling 3D models, primarily in .glb format. My goal is to import a 3D model that consists of groups and meshes. I aim to move meshes between existing groups within a model without altering the visual rep ...

How can I translate these JQuery functions into vanilla JavaScript?

I am currently in the process of building a configurator using transparent images. The image configurator functions through a basic JQuery function: I have assigned each input element a data attribute called data-Image. This function identifies the data-Im ...

The criteria is not fulfilled by either item.area_partition.homepage_show or item.area_partition.name in accordance with my needs

I am having an issue with some code snippet: <Col span="8" v-for="(item,index) in this.data" > <Card> <p slot="title" style="">{{ item.area_partition.homepage_show || item.area_partition. ...

The 'RegExpExecArray | null' type is required to include a method '[Symbol.iterator]()' which returns an iterator to iterate through its values

As someone who is new to TypeScript, I have a good understanding of the basics but recently came across a typecast error that I am struggling to solve. const [full, id]: string | null = /.*media\/[^\/]+\/(.*)/.exec(item.uri) When it comes t ...

Why does the JavaScript code work perfectly in Mozilla, but show an unknown runtime error in IE6?

When building my page, I implemented a simple blow up trick. Initially, the div is set as hidden, and when the image is clicked, a blow up effect occurs with an overlay image in the background. The JavaScript function updates the innerHTML. While this work ...

What would be a colloquial method to retrieve the ultimate result from the iterator function?

I've got a rather complex function that describes an iterative process. It goes something like this (I have lots of code not relevant to the question): function* functionName( config: Config, poolSize: number ): Generator<[State, Step], boo ...