What I exept:
Image
What I have: Image
var renderer = new THREE.WebGLRenderer();
renderer.setSize(1000, 1000);
renderer.setPixelRatio(window.devicePixelRatio);
const camera = new THREE.PerspectiveCamera(75, 1000 / 1000, 0.1, 1000)
camera.position.z = 0.5;
document.body.appendChild(renderer.domElement);
const scene = new THREE.Scene();
scene.background = new THREE.Color('white');
const gltfLoader = new THREE.GLTFLoader();
const url = 'hub.glb';
gltfLoader.load(url, (gltf) => {
const root = gltf.scene;
scene.add(root);
});
var render = () => {
requestAnimationFrame(this.render);
renderer.render(scene, camera);
}
render();
When I check the variables, the color material is set and correct.
Here's the variable explorer: Image
Thank you !
Try adding some lights to your scene:
const ambientLight = new THREE.AmbientLight( 0xffffff, 0.4 );
scene.add( ambientLight );
const dirLight = new THREE.DirectionalLight( 0xefefff, 1.5 );
dirLight.position.set( 10, 10, 10 );
scene.add( dirLight );