How to change mtl & obj Loader mesh change

Questions
,
1

hi, I just started three.js
I want to know how to load obj and mtl to modify the material
From default (MeshPhongMaterial) to MeshBasicMaterial
For example, blender exported obj and mtl
fl002
and I loaded it from three.js
But, How do i implement shadeless in Blender in three.js?
Can I change the material?
As follows I want to lighten the dark part of the object.
fl002_blender

Could you tell me how to make a realistic feel?
Thank you for your kind reply.

    function init() {
	//공간과 카메라
    var scene = new THREE.Scene();
    var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 1000);
    var webGLRenderer = new THREE.WebGLRenderer({
    	//alpha: true,
    	antialias: true
    });
    webGLRenderer.setClearColor(new THREE.Color(0xEEEEEE));
    webGLRenderer.setSize(window.innerWidth, window.innerHeight);
    camera.position.set(30, 30, 0);
    camera.lookAt(scene.position);
    console.log(camera);
    
  	//빛
	var light = new THREE.PointLight( 0xffffff, 1.5 );
	camera.add( light );
    var ambientLight = new THREE.AmbientLight( 0xffffff, 0.5 );
	scene.add( ambientLight );
	scene.add( camera );
    
	//control - 회전과 카메라 인터렉션
	var orbitControls = new THREE.OrbitControls(camera);
	console.log(orbitControls);
    orbitControls.autoRotate = false;
    var clock = new THREE.Clock();

    var onProgress = function ( xhr ) {
		if ( xhr.lengthComputable ) {
			var percentComplete = xhr.loaded / xhr.total * 100;
			console.log( Math.round(percentComplete, 2) + '% downloaded' );
		}
	};
	var onError = function ( xhr ) { };
	
    var path = "./resources/projects/";
    var fileName = "FL002.mtl";
    var url = "./resources/projects/FL002.mtl";
    
    var mtlLoader = new THREE.MTLLoader();
    var objLoader = new THREE.OBJLoader();
    
    var materials = new THREE.MeshBasicMaterial();
    
    mtlLoader.setPath(path);
    mtlLoader.load( fileName, function( materials ) {
        materials.preload();
        objLoader.setPath(path);
        objLoader.setMaterials( materials );
        
        console.log(materials);
		objLoader.load( 'FL002.OBJ', function ( object ) {
            console.log(object);
            object.children[0].material.map.anisotropy = 3;
            //object.children[0].material.needsUpdate = true;
            
            scene.add( object );
        }, onProgress, onError);

    });
     
    document.getElementById("WebGL-output").appendChild(webGLRenderer.domElement);
	render();
    function render() {
        var delta = clock.getDelta();
        orbitControls.update(delta);
        requestAnimationFrame(render);
        webGLRenderer.render(scene, camera);
    }
2

Of course you can change the material type after the OBJ has loaded. One possible approach is to traverse through object hierarchy and assign a new material like so:

objLoader.load( 'FL002.OBJ', function ( object ) {

    object.traverse( child => {

        if ( child.material ) child.material = new THREE.MeshBasicMaterial();

    } );

    scene.add( object );

}, onProgress, onError);
3

Thanks you! :rofl::grin:
I was able to give the shadeless effect of blender to ambientligth

4

var mtl= new MTLLoader();
var objl= new OBJLoader();
mtl
.setMaterialOptions({side: THREE.DoubleSide})
.load( ‘model.mtl’, ( materials ) =>{
materials.preload();
objl
.setMaterials( materials )
.load( ‘model.obj’, ( object )=> {

                    object.traverse( child => {

                 if ( child.material ) child.material = new THREE.MeshPhongMaterial();
                        
                } );
                console.log(object);
                            object.scale.x = 0.14;
                            object.scale.y = 0.14;
                            object.scale.z = 0.14; 
                           object.position.set(0,-125,0);
                           object.rotateY(55);
                            this.scene.add( object );
                           
						},onProgress, onError);
                } );

I tried the above code to change the material, but it is showing the model all white, it is looking like all textures and images are removed and only meshPhong material is added. how to solve pls help