threepipe
Nelze vybrat více než 25 témat Téma musí začínat písmenem nebo číslem, může obsahovat pomlčky („-“) a může být dlouhé až 35 znaků.

script.ts 2.1KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  1. import {
  2. _testFinish, _testStart,
  3. Box3B,
  4. IObject3D,
  5. LoadingScreenPlugin,
  6. Mesh,
  7. Object3DWidgetsPlugin,
  8. PCFSoftShadowMap,
  9. PhysicalMaterial,
  10. PlaneGeometry,
  11. PointLight2,
  12. RenderTargetPreviewPlugin,
  13. ThreeViewer,
  14. Vector3,
  15. } from 'threepipe'
  16. import {TweakpaneUiPlugin} from '@threepipe/plugin-tweakpane'
  17. async function init() {
  18. const viewer = new ThreeViewer({
  19. canvas: document.getElementById('mcanvas') as HTMLCanvasElement,
  20. msaa: true,
  21. dropzone: {
  22. allowedExtensions: ['gltf', 'glb', 'hdr', 'obj', 'fbx', 'bin', 'png', 'jpeg', 'webp', 'jpg', 'exr'],
  23. addOptions: {
  24. disposeSceneObjects: true,
  25. autoSetEnvironment: true, // when hdr/exr is dropped
  26. },
  27. },
  28. plugins: [Object3DWidgetsPlugin, LoadingScreenPlugin],
  29. })
  30. // viewer.scene.addObject(new HemisphereLight(0xffffff, 0x444444, 10))
  31. const result = await viewer.load<IObject3D>('https://threejs.org/examples/models/fbx/Samba Dancing.fbx', {
  32. autoCenter: true,
  33. autoScale: true,
  34. })
  35. const ground = new Mesh(
  36. new PlaneGeometry(100, 100)
  37. .rotateX(-Math.PI / 2)
  38. .translate(0, new Box3B().expandByObject(result!).getSize(new Vector3()).y / -2, 0),
  39. new PhysicalMaterial({
  40. color: '#ffffff',
  41. })
  42. )
  43. ground.castShadow = false
  44. ground.receiveShadow = true
  45. viewer.scene.addObject(ground)
  46. const light = viewer.scene.addObject(new PointLight2(0xffffff, 8))
  47. light.position.set(0, 4, 1)
  48. light.lookAt(0, 0, 0)
  49. light.distance = 10
  50. light.decay = 1
  51. light.castShadow = true
  52. light.shadowMapSize.setScalar(1024)
  53. light.shadowNear = 0.1
  54. light.shadowFar = 10
  55. viewer.renderManager.renderer.shadowMap.type = PCFSoftShadowMap
  56. const rt = viewer.addPluginSync(RenderTargetPreviewPlugin)
  57. rt.addTarget(()=>light.shadow.map || undefined, 'shadow', true, true, true)
  58. const ui = viewer.addPluginSync(TweakpaneUiPlugin, true)
  59. ui.appendChild(light.uiConfig, {expanded: true})
  60. }
  61. _testStart()
  62. init().finally(_testFinish)