leakec / sihm

Standalone Interactive HTML Movie (SIHM): A highly-portable, interactive way to visualize your simulations.
https://leakec.github.io/sihm/
MIT License
1 stars 0 forks source link

Adding OBJ support #4

Closed leakec closed 1 year ago

leakec commented 1 year ago

I've added support for OBJ and MTL files. To do this I package the text from these files into a separate JavaScript file and then imported the files that way. The reason I did this, is everything can then be packaged with webpack without any extra files.

This is convenient for transporting the project to others, and it also avoids CORS issues, so we don't need to serve the web files, we can just run them, e.g., with xdg-open.

The only issue with this is handling MTL files that have images. How can I bundle image files as well? If I serve the HTML file everything works fine, but I run into CORS issues otherwise. Of course, the image files must also be transferred with the HTML file if we don't bundle.

leakec commented 1 year ago

I'm curious if it is possible to embed the image into the HTML file itself using something like this and modify the MTL file to load the image from the web rather than from a local file.

It may be possible to do this if we modify THREE's MTLLoader slightly. See here for an example where this was done.

leakec commented 1 year ago

This worked. In the end, I didn't need to change the MTLLoader at all, and I could just change the map_* values from a file to a base64 data URL. This may waste a bit of space (i.e., the size of the HTML file may be larger than it needs to be), since if two MTL files use the same image, it will be encoded twice as a base64 URL, and thus will take up twice the space that it needs to. The best solution here would be to use the base64 URL once, and somehow link things to it. Not sure if this is possible though.

leakec commented 1 year ago

I decided I don't think the above is really an issue, as textures should very rarely be used across multiple objects. A likely case is multiples of the same object, but we already take care of that by having a file registry, so we don't carry around duplicates of the same file.