# Help to load stl file

**URL:** <https://discourse.threejs.org/t/help-to-load-stl-file/560>\
**Category:** Questions\
**Tags:** loaders\
**Created:** [July 4, 2017, 12:32pm UTC](https://discourse.threejs.org/t/help-to-load-stl-file/560 "2017-07-04T12:32:42Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![mout99](https://avatars.discourse-cdn.com/v4/letter/m/779978/32.png) [@mout99](https://discourse.threejs.org/u/mout99)\
**Post date:** [July 4, 2017, 12:32pm UTC](https://discourse.threejs.org/t/help-to-load-stl-file/560/1 "2017-07-04T12:32:42Z")

</div>

Hello, I’m trying to upload a file. Stl but I’m not succeeding, it just does not appear on the screen, how do I solve it?

This is my code :

```
<script>
        var scene = new THREE.Scene();
        var camera = new THREE.PerspectiveCamera( 50, window.innerWidth/window.innerHeight, 1, 1000 );

        var renderer = new THREE.WebGLRenderer();
        renderer.setSize( window.innerWidth, window.innerHeight );
        document.body.appendChild( renderer.domElement );

        controls = new THREE.OrbitControls(camera, renderer.domElement);
            controls.center = new THREE.Vector3(
            );

        // var geometry = new THREE.BoxGeometry( 3, 1, 1 );
        // var material = new THREE.MeshBasicMaterial( { color: 'skyblue' } );
        // var cube = new THREE.Mesh( geometry, material );
        // scene.add( cube );

        var loader = new THREE.STLLoader();
            loader.load( 'js/novo/undefined.stl', function ( geometry ) {

                var material = new THREE.MeshPhongMaterial( { color: 'skyblue' } );

                var mesh = new THREE.Mesh( geometry, material );
                console.log( mesh);

                scene.add( mesh );

            } );

        camera.position.z = 5;

        var animate = function () {
            requestAnimationFrame( animate );

            renderer.render(scene, camera);
        };

        animate();
    </script>
```

---

<div class="post-metadata">

**Author:** ![FrankSilvaHM](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/franksilvahm/32/117_2.png) [@FrankSilvaHM](https://discourse.threejs.org/u/FrankSilvaHM)\
**Post date:** [July 4, 2017, 5:59pm UTC](https://discourse.threejs.org/t/help-to-load-stl-file/560/2 "2017-07-04T17:59:12Z")

</div>

Edit: I thought maybe no lighting might have been your problem… guess you don’t technically need lights…

---

<div class="post-metadata">

**Author:** ![mout99](https://avatars.discourse-cdn.com/v4/letter/m/779978/32.png) [@mout99](https://discourse.threejs.org/u/mout99)\
**Post date:** [July 5, 2017, 5:06am UTC](https://discourse.threejs.org/t/help-to-load-stl-file/560/3 "2017-07-05T05:06:20Z")

</div>

I already managed to solve, I changed my loader to var loader = new THREE.STLLoader ();  
Loader.load (‘js / new / undefined.stl’, function (geometry) {

```
                Var material = new THREE.TextureLoader (). Load ("js / new / back2.jpg");
                Var mesh = new THREE.Mesh (geometry);
                Mesh.scale.set (0.1, 0.1, 0.1);
                // mesh.rotation.set (- Math.PI / 2, Math.PI / 2, 0);
                // mesh.scale.set (0.3, 0.3, 0.3);
                // mesh.receiveShadow = true;
                Scene.add (mesh);
            });

```

I managed to solve without needing a light

---

<div class="post-metadata">

**Author:** ![EliasHasle](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/eliashasle/32/3010_2.png) [@EliasHasle](https://discourse.threejs.org/u/EliasHasle)\
**Post date:** [July 8, 2017, 1:21pm UTC](https://discourse.threejs.org/t/help-to-load-stl-file/560/4 "2017-07-08T13:21:53Z")

</div>

Good. Phong material looks horrible without lights, though. 🙂