Hi,
I would like to add a percentage of loading (100%) in text in Unity’s WebGL loading screen.
I am not sure how to add this inside of js file of Unity. Can someone guide me?
One way is to use custom WebGLTemplates.
Depending on the installation destination, the default is
C:\UnityEditor\2022.2.8f1\Editor\Data\PlaybackEngines\WebGLSupport\BuildTools\WebGLTemplates
In such a path, you will find the WebGLTemplates folder provided by Unity.
Copy this WebGLTemplates folder into the Assets folder of the project, delete the folders other than the Default folder in the copied WebGLTemplates folder, and rename the Default folder to, for example, “Custom”.
Open Player Settings in the Unity Editor, and in “Resolution and Presentation”, you will find “WebGL Template” and add a “Custom” Template there.
Inside the Custom folder are other related files, including index.html, look at the contents of index.html.
createUnityInstance(canvas, config, (progress) => {
I think there is a line that says
The argument progress of this callback function is the read percentage, which is a value between 0.0 and 1.0.
Add an element in index.html to display the percentage and set the percentage to the textContent of that element in this callback function.
After that, if you select “Custom” for “WebGL Template” in “Resolution and Presentation” and build, you can display the percentage when loading.
2 Likes
