[SOLVED] Online Editor Prefiltered Reflection Are Cloudy

Mackey_Kinard · August 4, 2018, 3:54pm

Hello… Yo @yaustar … Steven…

I am trying to use Skybox In Online Editor. I uploaded six HDR and made Cubemap and hit Prefilter button… But the Sphere is TOTALLY metallic value 1 and total glossiness value 100… That guy should be reflecting almost mirror like… But it is really cloudy…

Here is how is SHOULD look:

The sphere is clearly reflecting the sky…

But in PlayCanvas Editor… it looks like this

Any info as why is would look so cloudy when its a PBR with total metal and glossiness ???

yaustar · August 4, 2018, 5:29pm

Can you send a link to the playcanvas project? At a guess, Playcanvas has skybox lighting as default on the material. Try disabling that to see if that gives you the result you want?

Mackey_Kinard · August 4, 2018, 7:59pm

I tried EVERY checkbox on the Material and the Skybox… Still Cloudy…

Have a Look: https://playcanvas.com/project/568856/overview/test-skybox-project

yaustar · August 4, 2018, 9:36pm

Hmm… Either there’s an issue with PlayCanvas engine/editor on formats of cubemaps/HDRs or there’s an invisible difference in the HDR files used

Edit: As a stupid suggestion, can you resize the textures to 512 x 512?

Mackey_Kinard · August 4, 2018, 10:33pm

So you see it too… it’s not just me…

I will try 512 hdr and see what that does

Mackey_Kinard · August 4, 2018, 10:41pm

I tried 512 … still same thing

It must not like my HDR from Unity

Mackey_Kinard · August 4, 2018, 11:06pm

Yo @yaustar and @max

I think there is a bug in the Current Version of the Online Editor When using HDR Skybox…

I downloaded and then reupload the Helipad.hdr files and created a skybox from them again…

SAme files that where work before… just re-import them and they show up like this:

Mackey_Kinard · August 4, 2018, 11:11pm

Yo @yaustar … As a matter of fact if you delete the png and got to source folder and RE-Import the HDR that are already there… Then re-create a skybox with those re-imported png’s and the skybox will look like above

Mackey_Kinard · August 4, 2018, 11:25pm

Yep… Most def… Is a probelm with the current version of the editor… I used a Helipad.dds already generated a while ago… Looks Great… And Clear:

So hopefully the PLayCanvas folks will quite IGNORING me. And see something is wrong.

Or Better Yet… Tell us how we can generate our own DDS.

I gotta say, for this to be Open Source Engine, And they say ONLY cant use Editor with Engine Only… Is Kinda Of BULL CRAP… If you cant make a skybox dds on your own, even when using engine only… YOU STILL GOTTA USE THE ONLINE EDITOR in your workflow to make Skybox DDS… If im wrong… Please Show Me Otherwise.

yaustar · August 5, 2018, 9:01am

Again, with that tone you are not making yourself someone that people want to help.

The engine is open source so somewhere in the code shows how it’s loading the skybox.

No open source project is under any obligation to provide support or documentation.

What I could do is export a build of the model viewer scene so you can see how the PlayCanvas online editor handles the skybox when it is built?

Mackey_Kinard · August 5, 2018, 12:31pm

That would be helpful. I’ll try to figure out from that. If not, no worries.

Btw, your interested in the Offline Editor approach using the editing tools of Unity and exporting to PlayCanvas … Just let me know, I can make you a copy of my project and since you know the API and folks like you around these parts… maybe you might want to take over the project

yaustar · August 5, 2018, 9:38pm

Mackey_Kinard · August 6, 2018, 2:33am

Hey @yaustar … would you happen to know how to load both the Cubemap and textures for a skybox from already download app.assets using app.assets.find.

I know about specifying the ‘url’ on the options and the textures array of urls for the texture. But that obviously downloads the asset directly into skybox.

But as an optimization for GLB files I will already have the dds and png available in the app. Assets so no need to re download using the json options

If no can, no can

Just wondering if I can make work a little smoother with GLTF

yaustar · August 6, 2018, 7:50am

What do you meaning by ‘load’ the cubemap if they are already in assets?

As in you want to set the skybox from a cubemap that is already in assets registry?

Or you want to create a cubemap with existing loaded DDS and textures?

Mackey_Kinard · August 6, 2018, 8:04am

I want to SET a skybox from a Cubemap and textures already in asset registry

Mackey_Kinard · August 6, 2018, 8:41am

I can set the textures, but have no idea how to set the cubemap as well

My Current Code:

            let rooturl = scenepath;
            if (rooturl != null && rooturl !== "" && !(<any>rooturl).endsWith("/")) rooturl += "/";
            let assets:pc.Asset[] = [
                /* new pc.Asset(basename + "_env", "cubemap", { url: rooturl + basename + "_env.dds"}), */
                new pc.Asset(basename + "_posx", "texture", { url: rooturl + basename + "_posx.png"}),
                new pc.Asset(basename + "_negx", "texture", { url: rooturl + basename + "_negx.png"}),
                new pc.Asset(basename + "_posy", "texture", { url: rooturl + basename + "_posy.png"}),
                new pc.Asset(basename + "_negy", "texture", { url: rooturl + basename + "_negy.png"}),
                new pc.Asset(basename + "_posz", "texture", { url: rooturl + basename + "_posz.png"}),
                new pc.Asset(basename + "_negz", "texture", { url: rooturl + basename + "_negz.png"})
            ];
            SceneManager.LoadAssets(this.app, assets, ()=> {
                // Set the asset textures sources into the cubemap
                // let environ:any = this.app.assets.find(basename + "_env");
                let textures:any = [
                    this.app.assets.find(basename + "_posx"),
                    this.app.assets.find(basename + "_negx"),
                    this.app.assets.find(basename + "_posy"),
                    this.app.assets.find(basename + "_negy"),
                    this.app.assets.find(basename + "_posz"),
                    this.app.assets.find(basename + "_negz")
                ];
                let cubemap:pc.Texture = new pc.Texture(this.app.graphicsDevice, options);
                cubemap.setSource(textures.map(function(texture) {
                    return texture.resource.getSource();
                }));
                // Set skybox and execute callback
                this.app.scene.skybox = cubemap;
                if (callback != null) callback();
            });

Mackey_Kinard · August 6, 2018, 5:30pm

Holy crap… It looks like there server packages the compressed textures into DDS also… Probably just the 128 Byte DDS header with with their compressed pixels as the rest … Or something like that… That gonna be a TOUGHY.

To start i will be using GLTF Images Spec which is ONLY jpg and png. But i might add metadata tag that image has a “COMPRESSED” version if available for that platform, then download and use the compressed version instead of the DEFAULT PNG or JPG… Or something along those lines…

But now i SEE what they produce… Re-Creating those compressed textures is another story… Worse case can always use the Online Edit just for Compressing Texture and Baking Skybox DDS… Basically anything that encodes a DDS file for PlayCanvas (Which are special proprietary like DDS files)

Thanks BRO

dave · August 7, 2018, 4:45pm

Hi,

This was a regression that snuck back into the Editor. We’re released a fix this morning. You will need select any cubemap assets which show this, click the “Delete Prefiltered Data” button and then click the “Prefilter” button to regenerate the prefiltered textures.

Sorry for the inconvenience.