There is a complete absence of light within my three.js scene

Hey there! I'm facing an issue with my code. I've been working on a project using three.js which includes a scene, 2 objects, renderer and camera. However, when I added the light, it didn't show up at all! I've tried multiple options but nothing seems to be helping me out. Here's the code snippet - http://codepen.io/usf/pen/LaDwh

var light = new THREE.SpotLight(0xff0000);
light.position.set( 0, 0, 50 );

var pointLight = new THREE.PointLight( 0xffffff);
pointLight.position.set( 0, 0, 50 );

scene.add(light);
scene.add(pointLight);

//rendering
renderer.render(scene, camera);

I'm quite puzzled about what could be causing this problem. Any insights would be greatly appreciated!

Answer №1

MeshBasicMaterial does not interact with lighting effects. Consider using MeshPhongMaterial instead.

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

Error: The function $(...).draggable is not recognized" and "Error: The object $.browser is not defined

I encountered an error stating, TypeError: $(...).draggable is not a function. To resolve this issue, I added jQuery as follows: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> < ...

Seeking out the index of each instance of a specific element within an array using Ramda.js techniques

I am currently attempting to locate the index of all occurrences of both Header and Footer within an array. var arr = [ 'data', 'data', 'data', 'data', 'Header', 'data', 'data', 'd ...

Vue initialization encounters an issue with starting 'marker-animate-unobtrusive' package

I am encountering an issue with marker-animate-unobtrusive and keep receiving the following error: https://i.sstatic.net/Y69xK.png While browsing through SO, I came across a post discussing the importance of requiring the file after Google has loaded. Ho ...

Difficulty fetching css files on handlebars (express API)

Recently, I encountered an issue where the CSS styles were not being applied to my HBS code despite several attempts. The structure of my service is as follows: Service Controllers Models public css styles.css Routers Views index.hbs app.js pac ...

Utilizing recursion and the reduce method for calculating the total of an array elements

Exploring the idea of a recursive function to sum up an array. Here's the array structure I'm experimenting with: [[[1, 2, [[3], 4]], 5, []]] As I delve into learning, I decided to implement it using reduce... and it's been quite successfu ...

Preserve the iframe src value in the dropdown menu even after the page is refreshed

I am trying to figure out how to prevent the iframe src from changing when I refresh the page, unless the user manually changes it using the dropdown menu with JavaScript. Can someone help me with this? <div class="row"> <div class="span9"> ...

Implementing authentication middleware with React Router in a React component

Working on my app.js, I'm trying to implement an Auth component that acts as middleware to check if the user is logged in. const App = props => ( <BrowserRouter> <Provider store={store}> <div className="app"& ...

What is the most efficient way to transfer a value from the main application file to a router file using the express framework

Currently, I am developing an Express application with multiple routes. To ensure modularity, each route will have its own file stored in a dedicated routes folder. One challenge I encountered is sharing a common value across all routes. Specifically, I n ...

Embed fashion and graph elements into a CSV document (generated from <script>)

Encountering an issue with my code. I am looking to export an HTML table to a CSV file (specifically Libre Office Calc, regardless of csv, xls or xlsx format, as long as it runs on a Linux Server). Found a script online that works well after some modificat ...

The bot believes it's jamming out to some tunes, but there's nothing but silence in the realm

Essentially, a slash command is utilized to initiate playing a music video in Distube. It plays for approximately 30 seconds and then abruptly stops, even though the queue indicates that the music is still playing. There are no errors appearing in my termi ...

Retrieving a variable from a JSON array with multiple dimensions using jQuery

Currently, I am working on fetching a multidimensional JSON array using JQUERY. I am facing challenges in extracting specific items from the array and inserting them into the HTML. I need assistance in navigating through the array to retrieve these elemen ...

Encountering issues when trying to access a property after setting an EJS variable in

Whenever this code runs, an interesting type error occurs within the if statement. It says: Cannot read property product.thumbgallery1 of undefined. var urlArray= []; var product = '<%- product %>'; console.dir(product); ...

Show two choices in a select box next to each other

I've been attempting to display a select box with two options side by side in a list format. Struggling to find any libraries that can achieve this functionality. Here is an example: <select> <option x><option y> <optio ...

Error message "Encountered an unknown type 'ForOfStatement' when attempting to execute an npm library"

Currently, I am in the process of integrating the PhotoEditor SDK library into my Ruby on Rails project. To achieve this, I have been meticulously following the installation guidelines provided in the official documentation. However, during the setup proce ...

Tailoring information to fit selected preferences

Currently working on developing a fitness app with Vue, aiming to create personalized workout routines based on user preferences. Users can choose specific options and generate a workout plan by clicking a button. The collected data is stored as an object ...

Guide on separating a variable by commas using jQuery

After making an Ajax call to a Java servlet, I am retrieving data and storing it in the 'data' variable upon success. Here is the code snippet: var s1=""; var ticks =""; $('#view').click(function(evt ...

Can we selectively execute certain tests in Cypress using support/index.js?

I need to selectively run certain tests from a pool of 50 test files located in the integration folder. Specifically, I only want 10 of them to execute. In an attempt to achieve this, I am trying to configure the selection process within the support/index. ...

Accessing the app module in separate files is not possible for Angular and Coffeescript

As I work on managing and refactoring my Angular code in a Rails project with CoffeeScript, I am facing issues accessing Angular objects between multiple files. Here is the current file structure: javascripts |-Angular |-controllers | |-search_strl.js ...

JavaScript - Retrieve all properties and methods of an object

Can an object created through a constructor function have its keys listed using the Object.keys() method? Let's consider an example with the following code: function Foo () {} Foo.prototype.bar = 'bar'; Foo.prototype.baz = 'baz'; ...

Getting JSON or JSONP data through a XAMPP local server is a straightforward process

After setting up a local server with XAMPP, my goal is to retrieve JSON / JSONP data from that server. Additional query: Do I need to upload the JSON file directly onto the server? Or can I achieve this using somePHPcoding? If so, which? I have come ac ...