threepipe
Du kannst nicht mehr als 25 Themen auswählen Themen müssen mit entweder einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

script.ts 1.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. import {_testFinish, downloadBlob, ThreeViewer} from 'threepipe'
  2. const viewer = new ThreeViewer({canvas: document.getElementById('mcanvas') as HTMLCanvasElement, msaa: true})
  3. async function init() {
  4. // load obj + mtl
  5. await viewer.load('https://threejs.org/examples/models/obj/male02/male02.obj', {
  6. autoCenter: true,
  7. autoScale: true,
  8. })
  9. // export to glb
  10. const blob = await viewer.exportScene()
  11. if (!blob || blob.ext !== 'glb') {
  12. console.error('Unable to export scene')
  13. return
  14. }
  15. // clear scene
  16. viewer.scene.disposeSceneModels()
  17. // load environment map and glb
  18. await viewer.setEnvironmentMap('https://threejs.org/examples/textures/equirectangular/venice_sunset_1k.hdr')
  19. await viewer.load({
  20. path: 'file.glb',
  21. file: blob,
  22. })
  23. // add download button
  24. const downloadButton = document.createElement('button')
  25. downloadButton.innerText = 'Download .glb'
  26. downloadButton.style.position = 'absolute'
  27. downloadButton.style.bottom = '3rem'
  28. downloadButton.style.right = '3rem'
  29. downloadButton.style.zIndex = '10000'
  30. downloadButton.onclick = () => downloadBlob(blob, 'file.glb')
  31. document.body.appendChild(downloadButton)
  32. }
  33. init().then(_testFinish)