Parse binary STL file

My goal is to load private stls with three.js from my (non-public) Laravel 8 storage folder.

Of course this is not possible with the .load function from the STLLoader.js like this:

const loader = new THREE.STLLoader();
const material = new THREE.MeshPhongMaterial({ color: 0x888888, specular: 0x111111, shininess: 2 });

loader.load( '../storage/app/private/file.stl', function ( geometry ) {
    const mesh = new THREE.Mesh( geometry, material );

    scene.add( mesh );
});

…because the filepath had to point to the private storage outside ob the web-root folder and for that reason it could not work.

My current approach to solve this issue is to make an ajax post request to some STLController where I use the get method for retrieving file contents from Laravel to get the stl-file contents this way:

return Storage::get('private/file.stl');

Like this I can now use the response data with the .parse function from the STLLoader.js to use it with three.js.

const loader = new THREE.STLLoader();
const material = new THREE.MeshPhongMaterial({ color: 0x888888, specular: 0x111111, shininess: 2 });

$.ajax({
    type:'POST',
    url: "get_stl_file_contents",
    success: function(data) {

        geometry = loader.parse(data);

        mesh = new THREE.Mesh(geometry, material);
        scene.add(mesh);
    },
});

This works fine if the STL file is in ascii format, BUT if it is in binary format I get the same ERROR message all the time (no matter how small or big the file actually is):

[ERROR] RangeError: Out of bounds access - (getFloat32)

Why is that?

If I console.log() the response data string of the binary file and compare it with the actual binary file content it doesn’t differ at all.
Also if I hardcode the binary file content of a small STL as a string into my JS code and try to parse it this way I get the same ERROR.

I either need a way to convert the response data from binari to ascii before using it like I do now
OR I would need another way to load/parse an stl for three.js from the raw binary file contents.

Did I forgot about something important?

Thanks for any help! :hugs:

Duplicate here:

I recommend you create a working demo in JSFiddle or CodePen, since using .parse() on a binary file should work just as well as using a .load() that points to the same data. You may have found a bug on the STLLoader, but we can’t be certain until we see a working demo.

1 Like

@marquizzo

This is my current Pen trying to recreate my scenario.

For my testAscii file content the STLLoader .parse function is working fine but if you change the input for the .parse function to the testBinary file content it doesn’t work anymore…

I also don’t know if this is the right way to test it with binary files but i couldn’t figure out a better solution for this:/

Hello leon, i’m facing the same issue. Did you solve this at the end? thx

Hi @Roy_He,

Yes. I finally solved the problem with some kind of workaround…
I posted my solution a few weeks ago here on stackoverflow. Hope it helps!

2 Likes