I am trying to add three.js based 3D objects to a PDF page. It seems there are no direct exporters available to do that. So I am trying to do the below thing,
- Convert the gltf/stl/obj files to U3D files
- Add the .u3d file to PDF page.
I am trying to do the below process and I am not sure whether this approach is possible. It will be a great help if there is any support available to do any one of the below conversions. Also if you know any other possible approaches, kindly update me!!
Input formats output format
GLTF
OBJ U3D
STL
(any
three.js supported
3D formats)
Thanks.
There are few options available to export the three.js graphics to a PDF ( static content not a dynamic U3D assets)
Static contents
Get the rendered data from the three.js webGL renderer / canvas renderer using
toDataURL("image/jpeg")
, change the MIME type to JPG/PNG and add the resulting stream as an image to PDF ( this worked for me)example - https://plnkr.co/edit/Ty8BZaDcflCJH5tH?preview
Like the above approach we can use three.js svgrenderer to export the renderer contents into a SVG data stream, which can be added into the PDF ( textures, mesh may not be 100% reproduced)
The legacy API - "threejs-pdf-renderer" can be used to directly export the three.js animations to a PDF. We don't need any other dependencies to create the PDF. But this is a legacy API which uses legacy three.js version, lot of effort needs to be done to make the API to be compatible with the latest three.js version.
example - https://satheeshks10.github.io/ThreejsPDFGenerator/
Dynamic 3D contents
We can export the three.js animations into a U3D file (no direct support is available as for now), this U3D file can be directly embedded into PDF. example - https://tetra4d.com/pdf-samples/