MeshBasicMaterial (black screen while running code)

When running code it’s showing nothing but black screen. When I change material to MeshBasicMaterial it does works but it does not shows all the colors of the model. I’d be happy if someone can help to solve this issue. Thanks.

    <script> 
        document.addEventListener('DOMContentLoaded', function() { 
            var scene = new THREE.Scene(); 
            var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); 
            camera.position.z = 5; 
             
            var renderer = new THREE.WebGLRenderer(); 
            renderer.setSize(window.innerWidth, window.innerHeight); 
            document.body.appendChild(renderer.domElement); 
             
            var controls = new THREE.OrbitControls(camera, renderer.domElement); 

            directionalLight = new THREE.DirectionalLight(0xffffff,100);
            directionalLight.position.set(0,1,0);
            directionalLight.castShadow = true;
            scene.add(directionalLight);
             
            light = new THREE.PointLight(0xc4c4c4,10);
            light.position.set(0,300,500);
            scene.add(light);

            light2 = new THREE.PointLight(0xc4c4c4,10);
            light2.position.set(500,100,0);
            scene.add(light2);

            light3 = new THREE.PointLight(0xc4c4c4,10);
            light3.position.set(0,100,-500);
            scene.add(light3);

            light4 = new THREE.PointLight(0xc4c4c4,10);
            light4.position.set(-500,300,0);
            scene.add(light4);

            var loader = new THREE.PLYLoader(); 
            var meshes = []; 
             
            function loadPLY(file) { 
                loader.load(file, function (geometry) { 
                    var material = new THREE.MeshBasicMaterial({ color: 0xffffff, wireframe: false });   
                    var mesh = new THREE.Mesh(geometry, material); 
                    scene.add(mesh); 
                    meshes.push(mesh); 
                }); 
            } 
             
            loadPLY('https://mi.istj.su/uploads/android/nn.ply'); 
            loadPLY('https://mi.istj.su/uploads/android/vv.ply'); 
             
            function animate() { 
                requestAnimationFrame(animate); 
                controls.update(); 
                renderer.render(scene, camera); 
            } 
             
            animate(); 
        }); 
    </script> 

I’d suggest trying an environment map first. Either you can load one from a texture, or use RoomEnvironment as shown here:

Envmaps require less tuning to get a correct result for different material types and scene scales, and are likely to look better too.

If you want to continue with point lights, the intensities will need to be much higher, or the light decay decreased from physically-based (2) to 0 so it does not attenuate over distance. A 10-candela light 0.5 km away is not bright enough. It’s usually easiest to work on lighting with a GUI like lil-gui or tweakpane, so you can adjust things and find what works best.