Skip to content

Commit a53dfff

Browse files
MichalDybizbanskiCreooxMichalDybizbanskiCreoox
committed
Support GLTFLoaderPlugin::load::loadersGl parameter to load alternative loaders.gl version
1 parent 38983e0 commit a53dfff

5 files changed

Lines changed: 94 additions & 3 deletions

File tree

‎examples/buildings/glb_alternative_loadersGl.html‎

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<title>xeokit Example</title>
8+
<link href="../css/pageStyle.css" rel="stylesheet"/>
9+
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/js/all.min.js"></script>
10+
</head>
11+
<body>
12+
<input type="checkbox" id="info-button"/>
13+
<label for="info-button" class="info-button"><i class="far fa-3x fa-question-circle"></i></label>
14+
<canvas id="myCanvas"></canvas>
15+
<div class="slideout-sidebar">
16+
<img class="info-icon" src="../../assets/images/gltf_logo.png"/>
17+
<h1>GLTFLoaderPlugin</h1>
18+
<h2>Using an alternative loaders.gl version</h2>
19+
<p>In this example, we're using a <a
20+
href="../../docs/class/src/plugins/GLTFLoaderPlugin/GLTFLoaderPlugin.js~GLTFLoaderPlugin.html"
21+
target="_other">GLTFLoaderPlugin</a> to load the <a
22+
href="https://sketchfab.com/bimcc"
23+
target="_other">House Plan</a> demo model from
24+
binary glTF (.glb).</p>
25+
<h3>Components used</h3>
26+
<ul>
27+
<li>
28+
<a href="../../docs/class/src/viewer/Viewer.js~Viewer.html"
29+
target="_other">Viewer</a>
30+
</li>
31+
<li>
32+
<a href="../../docs/class/src/plugins/GLTFLoaderPlugin/GLTFLoaderPlugin.js~GLTFLoaderPlugin.html"
33+
target="_other">GLTFLoaderPlugin</a>
34+
</li>
35+
</ul>
36+
<h3>Assets</h3>
37+
<ul>
38+
<li>
39+
<a href="https://sketchfab.com/bimcc" target="_other">Model source</a>
40+
</li>
41+
</ul>
42+
</div>
43+
</body>
44+
<script type="module">
45+
46+
// User-provided loaders.gl
47+
import * as loadersGlCore from "https://cdn.jsdelivr.net/npm/@loaders.gl/core@4.4.1/+esm";
48+
import * as loadersGlGltf from "https://cdn.jsdelivr.net/npm/@loaders.gl/gltf@4.4.1/+esm";
49+
50+
// Alternatively e.g.
51+
// import * as loadersGlCore from "https://esm.sh/@loaders.gl/core@4.4.1";
52+
// import * as loadersGlGltf from "https://esm.sh/@loaders.gl/gltf@4.4.1";
53+
54+
import {Viewer, GLTFLoaderPlugin} from "../../src/index.js";
55+
56+
const viewer = new Viewer({
57+
canvasId: "myCanvas",
58+
transparent: true,
59+
dtxEnabled: false
60+
});
61+
62+
viewer.camera.eye = [1394.38, 3.78, -247.05];
63+
viewer.camera.look = [1391.46, 0.89, -244.24];
64+
viewer.camera.up = [-0.41, 0.81, 0.40];
65+
66+
const gltfLoader = new GLTFLoaderPlugin(viewer);
67+
68+
const sceneModel = gltfLoader.load({
69+
id: "myHousePlan",
70+
src: "../../assets/models/gltf/HousePlan/glTF-Binary/HousePlan.glb",
71+
loadersGl: { core: loadersGlCore, gltf: loadersGlGltf }
72+
});
73+
74+
sceneModel.on("loaded", () => viewer.cameraFlight.jumpTo(sceneModel));
75+
76+
window.viewer = viewer;
77+
</script>
78+
</html>

‎examples/buildings/index.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -319,7 +319,8 @@
319319

320320
["glb_autoMetaModel_MAP", "IFC MAP model loaded from glTF into SceneModel using autoMetaModel option"],
321321
["glb_HousePlan", "House plan model loaded from GLB into SceneModel using GLTFLoaderPlugin"],
322-
["glb_VianneyHouse", "Vianney house model loaded from GLB into SceneModel using GLTFLoaderPlugin"]
322+
["glb_VianneyHouse", "Vianney house model loaded from GLB into SceneModel using GLTFLoaderPlugin"],
323+
["glb_alternative_loadersGl", "Alternative loaders.gl library version"]
323324
],
324325

325326
"dotbim": [

‎src/plugins/GLTFLoaderPlugin/GLTFLoaderPlugin.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -323,6 +323,7 @@ class GLTFLoaderPlugin extends Plugin {
323323
* @param {Boolean} [params.globalizeObjectIds=false] Indicates whether to globalize each {@link Entity#id} and {@link MetaObject#id}, in case you need to prevent ID clashes with other models.
324324
* @param {*} [params.parseOptions={}] Options to pass to loaders.gl parse method, eg. ````{ gltf: { excludeExtensions: { "KHR_texture_transform": false } } }````.
325325
* @param {Boolean} [params.entityPerMesh=false] Create an entity for each mesh, instead of grouping leaf meshes under their common entity.
326+
* @param {*} [params.loadersGl={core,gltf}] Alternative user-provided loaders.gl library.
326327
* @returns {Entity} Entity representing the model, which will have {@link Entity#isModel} set ````true```` and will be registered by {@link Entity#id} in {@link Scene#models}
327328
*/
328329
load(params = {}) {

‎src/plugins/GLTFLoaderPlugin/GLTFSceneModelLoader.js‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -101,11 +101,12 @@ function getBasePath(src) {
101101
function parseGLTF(plugin, src, gltf, metaModelJSON, options, sceneModel, ok, error) {
102102
const spinner = plugin.viewer.scene.canvas.spinner;
103103
spinner.processes++;
104-
parse(gltf, GLTFLoader, {
104+
const loadersGl = options.loadersGl;
105+
(loadersGl ? loadersGl.core.parse : parse)(gltf, loadersGl ? loadersGl.gltf.GLTFLoader : GLTFLoader, {
105106
...(options.parseOptions || { }),
106107
baseUri: options.basePath
107108
}).then((gltfData) => {
108-
const processedGLTF = postProcessGLTF(gltfData);
109+
const processedGLTF = (loadersGl ? loadersGl.gltf.postProcessGLTF : postProcessGLTF)(gltfData);
109110
const ctx = {
110111
src: src,
111112
entityId: options.entityId,

‎types/plugins/GLTFLoaderPlugin/GLTFLoaderPlugin.d.ts‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,16 @@ export declare type LoadGLTFModel = {
8787
parseOptions?: any;
8888
/** Create an entity for each mesh, instead of grouping leaf meshes under their common entity. */
8989
entityPerMesh?: boolean;
90+
/** Alternative user-provided loaders.gl library. */
91+
loadersGl?: {
92+
core: {
93+
parse: (...args: any[]) => any;
94+
};
95+
gltf: {
96+
GLTFLoader: any;
97+
postProcessGLTF: (...args: any[]) => any;
98+
};
99+
};
90100
};
91101

92102
/**

0 commit comments

Comments
 (0)