# For unity, Can I load a scene with ui image and fonts by using one single glb file?

**URL:** <https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760>\
**Category:** 🌵 Needle Engine\
**Tags:** question\
**Created:** [December 16, 2025, 9:31am UTC](https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760 "2025-12-16T09:31:06Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![GeniusGogoing](https://forum.needle.tools/user_avatar/forum.needle.tools/geniusgogoing/32/4776_2.png) [@GeniusGogoing](https://forum.needle.tools/u/GeniusGogoing)\
**Post date:** [December 16, 2025, 9:31am UTC](https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760/1 "2025-12-16T09:31:06Z")

</div>

I’m developing a react web app. I got a requirement to make needle-engine to dynamiclly load scenes when users drag their own glb or gltf or an asset folder to needle-engine ui element.

I tried to save user’s files into indexDB.For single model it was fine, but for glb with dependencies like images, fonts, needle-engine can only load the glb set in src property but without any images,fonts.Because needle-engine loads the dependencies by a http request to static assets.Then I tried to use onCreateCustomModelLoader to custom the way of loading assets but i failed to write it out.

Then I tried to localhost dist folder in generated project and set src to the asset server. It is fine for the src resource but when needle-engine requests for depencies it still uses the localhost:3000(where i start my vite dev server).In the end, i configured vite server proxy to rewrite the request path to asset server to solve this problem.

If needle-engine supports compacting everything in the scene into one single glb file this will be much easier without considering how to resolve the dependency file loading problem.Or if there is already a config to set? I tried to find it in the docs but i failed.

Any help pls?Thanks.

---

<div class="post-metadata">

**Author:** ![needle-assistant](https://forum.needle.tools/user_avatar/forum.needle.tools/needle-assistant/32/3415_2.png) [@needle-assistant](https://forum.needle.tools/u/needle-assistant)\
**Post date:** [December 16, 2025, 9:31am UTC](https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760/2 "2025-12-16T09:31:06Z")

</div>

I’m sorry, I couldn’t find a response but notified the team 🤔

---

<div class="post-metadata">

**Author:** ![Marcel\_Wiessler1](https://forum.needle.tools/user_avatar/forum.needle.tools/marcel_wiessler1/32/21_2.png) [@Marcel\_Wiessler1](https://forum.needle.tools/u/Marcel_Wiessler1)\
**Post date:** [December 16, 2025, 9:58am UTC](https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760/3 "2025-12-16T09:58:29Z")

</div>

Hi @GeniusGogoing

Fonts and Audiofiles are currently stored externally. Images are packaged inside the glTF unless they’re referenced using an `ImageReference` field.

When a user drags a model on your UI element wouldnt it be sufficient to capture the Files that are dropped (e.g. a folder which contains glTF files + dependencies) ?

---

<div class="post-metadata">

**Author:** ![GeniusGogoing](https://forum.needle.tools/user_avatar/forum.needle.tools/geniusgogoing/32/4776_2.png) [@GeniusGogoing](https://forum.needle.tools/u/GeniusGogoing)\
**Post date:** [December 16, 2025, 12:08pm UTC](https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760/4 "2025-12-16T12:08:50Z")

</div>

Thanks for your reply!

At first, I thought capture the folder would be sufficient.I captured the folder, gather together as src input.But the cant load depency correctly.

 ![image](https://europe1.discourse-cdn.com/flex006/uploads/needle1/original/2X/9/915e0a01c7c2f69843485286a344b277ad62d3af.png)

This is my assets folder to drag.

---

<div class="post-metadata">

**Author:** ![GeniusGogoing](https://forum.needle.tools/user_avatar/forum.needle.tools/geniusgogoing/32/4776_2.png) [@GeniusGogoing](https://forum.needle.tools/u/GeniusGogoing)\
**Post date:** [December 16, 2025, 12:09pm UTC](https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760/5 "2025-12-16T12:09:22Z")

</div>

```typescript

// create url for every asset      
for (const file of supportedFiles) {
        const relativePath = file.webkitRelativePath || file.name
        const blobUrl = URL.createObjectURL(file)
        blobUrlMap.set(relativePath, blobUrl)
        blobUrlsRef.current.push(blobUrl)
        allBlobUrls.push(blobUrl)
}

```

Then I set allBlolUrls to src.

---

<div class="post-metadata">

**Author:** ![GeniusGogoing](https://forum.needle.tools/user_avatar/forum.needle.tools/geniusgogoing/32/4776_2.png) [@GeniusGogoing](https://forum.needle.tools/u/GeniusGogoing)\
**Post date:** [December 16, 2025, 12:09pm UTC](https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760/6 "2025-12-16T12:09:53Z")

</div>

![image](https://europe1.discourse-cdn.com/flex006/uploads/needle1/original/2X/2/2a4815ed2e3b9f37665dd845e3b5a2e9f7bd509e.jpeg)

That’s what i got in the web. Notice that the fonts are not shown.

---

<div class="post-metadata">

**Author:** ![GeniusGogoing](https://forum.needle.tools/user_avatar/forum.needle.tools/geniusgogoing/32/4776_2.png) [@GeniusGogoing](https://forum.needle.tools/u/GeniusGogoing)\
**Post date:** [December 16, 2025, 12:10pm UTC](https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760/7 "2025-12-16T12:10:23Z")

</div>

![image](https://europe1.discourse-cdn.com/flex006/uploads/needle1/original/2X/5/5ef51152dfb9b499cbd4da9f56c08c62a484a3d7.png)

Console Errors.

---

<div class="post-metadata">

**Author:** ![GeniusGogoing](https://forum.needle.tools/user_avatar/forum.needle.tools/geniusgogoing/32/4776_2.png) [@GeniusGogoing](https://forum.needle.tools/u/GeniusGogoing)\
**Post date:** [December 16, 2025, 12:11pm UTC](https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760/8 "2025-12-16T12:11:00Z")

</div>

![image](https://europe1.discourse-cdn.com/flex006/uploads/needle1/original/2X/c/c9ed3d6376c3590ee5c68d0edeca67fb9124a9c4.png)

network errors

---

<div class="post-metadata">

**Author:** ![GeniusGogoing](https://forum.needle.tools/user_avatar/forum.needle.tools/geniusgogoing/32/4776_2.png) [@GeniusGogoing](https://forum.needle.tools/u/GeniusGogoing)\
**Post date:** [December 16, 2025, 12:12pm UTC](https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760/9 "2025-12-16T12:12:41Z")

</div>

And it should be:

 ![image](https://europe1.discourse-cdn.com/flex006/uploads/needle1/original/2X/2/211936330989511a8206025bb26c5244c6de3528.jpeg)

Any advices?

_Looking forward to hearing from you. Sorry about the long-winded posts , it says i’m not allowed to upload more than one media per post for i’m new here._

---

<div class="post-metadata">

**Author:** ![Marcel\_Wiessler1](https://forum.needle.tools/user_avatar/forum.needle.tools/marcel_wiessler1/32/21_2.png) [@Marcel\_Wiessler1](https://forum.needle.tools/u/Marcel_Wiessler1)\
**Post date:** [December 16, 2025, 3:06pm UTC](https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760/10 "2025-12-16T15:06:12Z")

</div>

You need a way for three.js to resolve the original file URL to the blob url.

Here’s a little bit of code from Needle Cloud (not complete, you need to modify it for your project)

```ts

import { DefaultLoadingManager } from "three";

let files: FileWithPath[] = [];

export const activeFiles = writable<FileWithPath[]>([]);
activeFiles.subscribe(newFiles => {
    files = newFiles;
});

export function onFilesDropped(newFiles: FileWithPath[]) {
    activeFiles.set(newFiles);
}

export function init() {
    DefaultLoadingManager.setURLModifier(url => {
        if (url.startsWith("blob:")) {
            const file = files.find(file => url.includes(file.name));
            if (file) {
                return URL.createObjectURL(file as any as File);
            }
        }
        return url;
    });
}

```

---

<div class="post-metadata">

**Author:** ![GeniusGogoing](https://forum.needle.tools/user_avatar/forum.needle.tools/geniusgogoing/32/4776_2.png) [@GeniusGogoing](https://forum.needle.tools/u/GeniusGogoing)\
**Post date:** [December 18, 2025, 6:28am UTC](https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760/11 "2025-12-18T06:28:51Z")

</div>

It works! Thank you!!!😍

---

<div class="post-metadata">

**Author:** ![system](https://forum.needle.tools/user_avatar/forum.needle.tools/system/32/20_2.png) [@system](https://forum.needle.tools/u/system)\
**Post date:** [December 31, 2025, 6:29am UTC](https://forum.needle.tools/t/for-unity-can-i-load-a-scene-with-ui-image-and-fonts-by-using-one-single-glb-file/2760/12 "2025-12-31T06:29:09Z")

</div>

Closed on December 31, 2025, 6:29am UTC

This topic was automatically closed 13 days after the last reply. New replies are no longer allowed.