lzy
/
threepipe
Obserwuj 1
Gwiazdka 0
Forkuj 0
Kod Problemy 0 Pull Requests 0 Wydania 0 Wiki Aktywność
Przeglądaj źródła

Add USDZLoadPlugin.

master
Palash Bansal 2 lat temu
rodzic
1c98b0ce8b
commit
e79cbca3e4
No account linked to committer's email address
6 zmienionych plików z 137 dodań i 0 usunięć
Widok podzielony Pokaż statystyki zmian
  1. 19
    0
      README.md
  2. 1
    0
      examples/index.html
  3. 35
    0
      examples/usdz-load/index.html
  4. 31
    0
      examples/usdz-load/script.ts
  5. 50
    0
      src/plugins/import/USDZLoadPlugin.ts
  6. 1
    0
      src/plugins/index.ts

+ 19
- 0
README.md Wyświetl plik

@@ -217,6 +217,7 @@ Plugins can add additional formats:
* Models
* 3dm - Using [Rhino3dmLoadPlugin](#Rhino3dmLoadPlugin)
* ply - Using [PLYLoadPlugin](#PLYLoadPlugin)
* usdz - Using [USDZLoadPlugin](#USDZLoadPlugin)
* stl - Using [STLLoadPlugin](#STLLoadPlugin)
* ktx - Using [KTXLoadPlugin](#KTXLoadPlugin)
* ktx2 - Using [KTX2LoadPlugin](#KTX2LoadPlugin)
@@ -2262,6 +2263,24 @@ viewer.addPluginSync(new PLYLoadPlugin())
const mesh = await viewer.load('file.ply')
```

## USDZLoadPlugin

Example: https://threepipe.org/examples/#usdz-load/

Source Code: [src/plugins/import/USDZLoadPlugin.ts](./src/plugins/import/USDZLoadPlugin.ts)

API Reference: [USDZLoadPlugin](https://threepipe.org/docs/classes/USDZLoadPlugin.html)

Adds support for loading .usdz and .usda ([Universal Scene Description](https://graphics.pixar.com/usd/docs/index.html)) files.

```typescript
import {USDZLoadPlugin} from 'threepipe'
viewer.addPluginSync(new USDZLoadPlugin())

const mesh = await viewer.load('file.usdz')
const mesh2 = await viewer.load('file.usda')
```

## STLLoadPlugin

Example: https://threepipe.org/examples/#stl-load/

+ 1
- 0
examples/index.html Wyświetl plik

@@ -244,6 +244,7 @@
<li><a href="./hdr-load/">HDR Load </a></li>
<li><a href="./exr-load/">EXR Load </a></li>
<li><a href="./image-load/">Image(png, jpeg, svg, ico, webp, avif) Load </a></li>
<li><a href="./usdz-load/">USDZ, USDA Load </a></li>
<li><a href="./ply-load/">PLY Load </a></li>
<li><a href="./stl-load/">STL Load </a></li>
<li><a href="./ktx2-load/">KTX2 Load </a></li>

+ 35
- 0
examples/usdz-load/index.html Wyświetl plik

@@ -0,0 +1,35 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>USDZ / USDA Load</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Import maps polyfill -->
<!-- Remove this when import maps will be widely supported -->
<script async src="https://unpkg.com/es-module-shims@1.6.3/dist/es-module-shims.js"></script>

<script type="importmap">
{
"imports": {
"threepipe": "./../../dist/index.mjs"
}
}

</script>
<style id="example-style">
html, body, #canvas-container, #mcanvas {
width: 100%;
height: 100%;
margin: 0;
overflow: hidden;
}
</style>
<script type="module" src="../examples-utils/simple-code-preview.mjs"></script>
<script id="example-script" type="module" src="./script.js" data-scripts="./script.ts;./script.js"></script>
</head>
<body>
<div id="canvas-container">
<canvas id="mcanvas"></canvas>
</div>

</body>

+ 31
- 0
examples/usdz-load/script.ts Wyświetl plik

@@ -0,0 +1,31 @@
import {_testFinish, IObject3D, ThreeViewer, USDZLoadPlugin} from 'threepipe'

async function init() {

const viewer = new ThreeViewer({
canvas: document.getElementById('mcanvas') as HTMLCanvasElement,
msaa: true,
dropzone: {
allowedExtensions: ['usdz', 'usda', 'hdr', 'exr'],
addOptions: {
disposeSceneObjects: true,
autoSetEnvironment: true, // when hdr is dropped
autoSetBackground: true,
},
},
})

viewer.addPluginSync(USDZLoadPlugin)

const options = {
autoCenter: true,
autoScale: true,
}
await Promise.all([
viewer.setEnvironmentMap('https://threejs.org/examples/textures/equirectangular/venice_sunset_1k.hdr'),
viewer.load<IObject3D>('https://threejs.org/examples/models/usdz/saeukkang.usdz', options),
])

}

init().then(_testFinish)

+ 50
- 0
src/plugins/import/USDZLoadPlugin.ts Wyświetl plik

@@ -0,0 +1,50 @@
import {IViewerPluginSync, ThreeViewer} from '../../viewer'
import {Importer} from '../../assetmanager'
import {USDZLoader} from 'three/examples/jsm/loaders/USDZLoader.js'
import {Group, Mesh} from 'three'
import {Zippable, zipSync} from 'three/examples/jsm/libs/fflate.module.js'

/**
* Adds support for loading `.usdz`, `model/vnd.usd+zip` and `.usda`, `model/vnd.usda` files and data uris
* @category Plugins
*/
export class USDZLoadPlugin implements IViewerPluginSync {
declare ['constructor']: typeof USDZLoadPlugin

public static readonly PluginType = 'USDZLoadPlugin'
private _importer = new Importer(class extends USDZLoader {
private _currentUrl = ''
async loadAsync(url: string, onProgress?: (event: ProgressEvent) => void): Promise<Mesh> {
this._currentUrl = url
const res = await super.loadAsync(url, onProgress)
this._currentUrl = ''
return res
}

parse(buffer: ArrayBuffer): Group {
// todo make changes in three.js to allow passing unzipped buffer directly for usda
if (this._currentUrl.endsWith('.usda')) {
const filename = this._currentUrl.split('/').pop()
if (filename) {
const zip: Zippable = {}
zip[filename] = new Uint8Array(buffer)
buffer = zipSync(zip).buffer
}
}
return super.parse(buffer)
}
}, ['usdz', 'usda'], ['model/vnd.usd+zip', 'model/vnd.usdz+zip', 'model/vnd.usda'], false)

onAdded(viewer: ThreeViewer) {
viewer.assetManager.importer.addImporter(this._importer)
}

onRemove(viewer: ThreeViewer) {
viewer.assetManager.importer.removeImporter(this._importer)
}

dispose() {
return
}

}

+ 1
- 0
src/plugins/index.ts Wyświetl plik

@@ -22,6 +22,7 @@ export {FullScreenPlugin} from './interaction/FullScreenPlugin'

// import
export {Rhino3dmLoadPlugin} from './import/Rhino3dmLoadPlugin'
export {USDZLoadPlugin} from './import/USDZLoadPlugin'
export {PLYLoadPlugin} from './import/PLYLoadPlugin'
export {STLLoadPlugin} from './import/STLLoadPlugin'
export {KTXLoadPlugin} from './import/KTXLoadPlugin'

Napisz Podgląd
Ładowanie…
Anuluj
Zapisz