Preparing to import JSON file created with the THREE.js editor

        var container;
        var camera;
        var scene;
        var renderer;
        var mesh;
        var loader;

        initialize();

        function initialize(){


            camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1 , 10000); 
            camera.position.z = 1000;
            //scene

            scene = new THREE.Scene();
            loader = new THREE.ObjectLoader();

            loader.load( "chesstable.js", function( mesh ) {

                mesh.scale.set( 1,1,1);
                scene.add(mesh);

            } );


            renderer = new THREE.CanvasRenderer();
            renderer.setSize(window.innerWidth, window.innerHeight);

            document.body.appendChild(renderer.domElement);

            renderer.render(scene, camera);

        }

Hello there! I'm attempting to load a scene (composed of polygons and lights) exported from the THREE.js editor as a json file. It seems like the browser is able to load the json file, but unfortunately, all I see is a blank page. Can anyone help me troubleshoot this issue? Thanks so much in advance!

Answer №1

I believe the solution could be along these lines

loader.load( "boardgame.js", function( geometry ){
    piece = new THREE.Mesh( geometry, material);
    scenario.add(piece);
});

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

Guide to making a slider menu using html, css, and javascript

Just dipping my toes into the world of web development. I'm intrigued by the idea of creating a "slider menu" where users can view and select options by clicking on next or previous buttons (see example image below). While I've got some basic HTM ...

What is the best way to add the current date to a database?

code: <?php session_start(); if(isset($_POST['enq'])) { extract($_POST); $query = mysqli_query($link, "SELECT * FROM enquires2 WHERE email = '".$email. "'"); if(mysqli_num_rows($query) > 0) { echo '<script&g ...

Avoid using "out" when invoking the PHP function to access the database

I am attempting to call a PHP function from JavaScript by passing three arguments. On the PHP side, the function within the PHP file retrieves two values from the database and prints all the values. However, the code I have written does not seem to be work ...

Is it possible to merge createStackNavigator with createBottomTabNavigator for enhanced navigation functionality

Current Situation : My app currently has three tabs for navigation (School, Admin, Family); I am now facing a challenge as I want to add additional screens that do not require tabs for navigation. These screens will be accessed using this.props.navigati ...

How is it possible to access a variable in a function that hasn't been declared until later?

While working on a Dialog component, I had an unexpected realization. export const alert = (content: string) => { const buttons = [<button onClick={()=>closeModal()}>ok</button>] // seems alright // const buttons = [<button onCli ...

Guide on using webpack to import jQuery

When using webpack, is it necessary to install the jquery file from npm, or can I simply require the downloaded file from the jquery website? directory app/ ./assets/javascripts/article/create/base.js ./assets/javascripts/lib/jquery-1.11.1.min.js webpack ...

Issues encountered with AngularJs filter search functionality

Why am I having trouble adapting this search filter from here? This is what my code looks like: controllers.js angular.module('starter.controllers', ['starter.services']) .controller('AppCtrl', function($scope, $ionicModal ...

The Null object within localStorage is identified as a String data type

As someone transitioning from Java development to Javascript, I am seeking clarification on a particular issue. In my project, I am utilizing localStorage to keep track of the user's token in the browser. localStorage.token = 'xxx' When a ...

Navigating through search results on an XML page using jQuery

Context: I am currently facing a challenge involving the integration of Google search outcomes into a webpage I'm constructing. These findings are presented in XML format. My current approach to importing the XML is as follows: if (window.XMLHttpReq ...

Cancel an AJAX request without interfering with the subsequent request

When working with a number input and the "onChange" event, I have come across an issue with my ajax request. Upon aborting the request, it seems to have a negative impact on subsequent requests. If I send just one request without aborting, everything runs ...

What is the best way to download the entire page source, rather than just a portion of it

I am currently facing an issue while scraping dynamic data from a website. The PageSource I obtain using the get() method seems to be incomplete, unlike when viewing directly from Chrome or Firefox browsers. I am seeking a solution that will allow me to fu ...

Utilizing Next.js on Vercel with Sentry and opting out of source maps in the production environment

Currently setting up a Next.js application on Vercel with Sentry configuration thanks to the @sentry/next.js module. You can find an example repo here - https://github.com/voronianski/test-next-sentry-app This setup is based on the official example from N ...

Indeed, conditional validation is essential

I have encountered an issue with my schema validation where I am trying to validate one field based on another. For example, if the carType is "SUV", then the maximum number of passengers should be 6; otherwise, it should be 4. However, despite setting u ...

What is the syntax for defining parameters in an overloaded arrow function in TypeScript?

Trying to create an async arrow function that can handle a single image object or an array of image objects. I'm new to TypeScript overloading and may be approaching this the wrong way. Here's what I've come up with: type ImageType = { ...

exploring methods to prevent flash of unstyled content (fouc)

Looking for a way to control CSS with a cookie: Want the user's style choice to stick until they change it or the cookie expires Avoid any default styling issues when the user returns Avoid using jquery, libraries, or frameworks Need compatibility w ...

Oops! It seems like there's a problem with reading the 'strEmail' property of undefined. Do you have any ideas on how to fix this issue

Currently, I am working with Express.js to create a straightforward login post request. Here is the code snippet: app.post("/login", (req, res) => { res.send( { isUserRegistered: userLogin(req.body.strEmail, req.body.strPassword), ...

Tips on bringing data from a php file into a javascript variable

I'm faced with a challenge where I need to extract data from a MySQL database using a PHP file and then store that data in a JavaScript array for plotting purposes with jQuery's flot library. Has anyone encountered a similar situation and found a ...

Tips for creating a hover-activated dropdown menu

How can I create a drop-down menu in my horizontal navigation bar that appears when hovering over the Columns tab? The drop-down menu should include options such as Articles, Videos, Interview, and Fashion. To better illustrate what I am looking for, here ...

Manage form submission seamlessly without redirecting. Capture information without needing to prevent the default action, then proceed with redirection. Avoid redirecting when using preventDefault, but be aware that data may not

Currently stuck in a tricky situation. I've implemented a custom form submission to prevent redirecting when an express route is triggered by form submission. However, the issue arises when I lose the data being sent without redirection. document.get ...

Steps for removing every image from a folder

I'm currently facing an issue trying to remove all images from a directory. I'm encountering an error with the directory path and unsure of how to access and delete all image paths. Here is the structure of my directory : server -> app.js ...