I'm new to threeJS and want to display a sphere. But somehow I cant. Please help

Questions
1 
import * as THREE from "three";

//Scene
const scene = new THREE.Scene();

//created the sphere
const geometry = new THREE.SphereGeometry(10, 64, 64);
const material = new THREE.MeshStandardMaterial({
  color: "#00ff83",
});
const mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);

//Light
const light = new THREE.PointLight(0xffffff, 1, 100);
light.position.set(0, 10, 10);
scene.add(light);

//Camera
const camera = new THREE.PerspectiveCamera(45, 800 / 600, 1, 1000);
camera.position.z = 20;
scene.add(camera);

//Renderer
const canvas = document.querySelector(".webgl");
const renderer = new THREE.WebGLRenderer({ canvas });
renderer.setSize(800, 600);
renderer.render(scene, camera);
2

I think your light is inside the sphere. Try making the sphere a tenth of its current size to verify that’s the problem

1 Like
3

I tried, but unfortunately the problem remains as it is :frowning:

4

Could you reduce your topic title to something shorter and put that description into the post please.

5

Here’s a code sandbox of a working project. I’ll let you figure out why your project isn’t working

1 Like
6

As a beginner, take a look at some simple examples and modify them for practice.

Use the Collection of examples from discourse.threejs.org

e.g.
FPS-Counter-Console
MergingFiveGeometries
RaycastingSomeObjects
ObjectWithEdges
ExtrudedShapeWithHole

and the BeginnerExample

1 Like
7

ok done. pls check