[SOLVED] HDR to Cubemap using code


#1

Hello, I am engine user

and now I just try to make cubemap using playcanvas resource(Download from editor)

so I have .dds file and px.png, nx.png, py.png, ny.png, pz.png, nz.png files…

and also px.hdr, nx.hdr, py.hdr, ny.hdr, pz.hdr, nz.hdr files

and here is code

var data = {
    name: 'bridge',
    cubemap: 'Bridge.dds',
    textures: [
        'px.png',
        'nx.png',
        'py.png',
        'ny.png',
        'pz.png',
        'nz.png',
    ]
};

var textures = data.textures.map(function(v, i) {
    var asset = new pc.Asset(data.name + '-' + i, 'texture', { url: v }); 
    app.assets.add(asset);
    return asset.id;
});

var cubemap = new pc.Asset(
    data.name,
    'cubemap',
    { url: data.cubemap },
    {
        anisotropy: 1,
        magFilter: 1,
        minFilter: 1,
        rgbm: true,
        textures: textures
    }
);

app.setSkybox(cubemap)
app.scene.Exposure = 1;
app.scene._skyboxIntensity = 3;

It’s really darker than editor project.
Is this already hdr applied??


#2

The darkness could be because of the tonemapping mode you have set. Or maybe the skybox intensity setting on the scene.


#4

Thank you for your answer

The problem was GammaCorrection

I added this code

app.scene.gammaCorrection = pc.GAMMA_SRGB

So… what is pc.GAMMA_SRGB??

Thank you for giving me a clue. :slight_smile:


#5

https://developer.playcanvas.com/en/user-manual/designer/settings/#gamma-correction