Load XML3D models with AJAX/javascript (.stl or .json)

511 Views Asked by At

Is it possible to change the model from javascript/jquery/ajax? I managed only to visualize an .stl file (using the xml3d-stl-plugin mentioned by ksons on Can i use xml3d with stl models?) or xml3d .json file using the basic xml3d.js on get request only. It would be nice to be able to choose a 3d model via ajax and visualize it.

Perhaps even better, if it was possible to use the file directly from the client (using HTML5 local files), like in http://www.html5rocks.com/en/tutorials/file/dndfiles/ (this way it could start visualizing the file selected by the user and in the same time upload the file to a server to do some business logic with it, which would save a lot of time).

Is any of the two solutions possible in any way? (preferrably using .stl files directly)

1

There are 1 best solutions below

0
On BEST ANSWER

This is relatively easy using the URL.createObjectURL method:

<input id="upload" type="file"/>
<script>
    function handleFileSelect(evt) {
        var file = evt.target.files[0];
        $("mesh").attr("src", URL.createObjectURL(file));
    };
    document.getElementById('upload').addEventListener('change', handleFileSelect, false);
</script>

I added this functionality to the xml3d-stl-plugin example: http://xml3d.github.io/xml3d-stl-plugin/examples/

Similar, you can create references from XHR.