Update index.html

public/index.html

@@ -38,6 +38,19 @@ const cube = new THREE.Mesh(new THREE.BoxBufferGeometry(0.5, 0.5, 0.5), material
 cube.position.set(0, 0, -1);
 scene.add(cube);
 
+
+// Create a sphere geometry.
+const sphereGeometry = new THREE.SphereBufferGeometry(0.3, 32, 32); // Adjust the radius and other parameters as needed.
+
+// Create a material for the sphere (you can customize the color).
+const sphereMaterial = new THREE.MeshBasicMaterial({ color: 0xffff00 });
+
+// Create the sphere and add it to the scene.
+const sphere = new THREE.Mesh(sphereGeometry, sphereMaterial);
+sphere.position.set(1, 0, -1); // Position the sphere next to the cube.
+scene.add(sphere);
+
+
 // Set up the WebGLRenderer, which handles rendering to the session's base layer.
 const renderer = new THREE.WebGLRenderer({
   alpha: true,
@@ -92,6 +105,8 @@ const onXRFrame = (time, frame) => {
 }
 session.requestAnimationFrame(onXRFrame);
 
+
+
 }
 </script>
 </body>