Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add support for KHR_materials_unlit #6977

Merged
merged 9 commits into from
Sep 5, 2018
Merged

Add support for KHR_materials_unlit #6977

merged 9 commits into from
Sep 5, 2018

Conversation

OmarShehata
Copy link
Contributor

Resolves #6507.

As described in the spec, any glTF that has this extension defined as shown below will be rendered just using its base color.

"materials": [
    {
        "name": "unlit_with_fallback",
        "pbrMetallicRoughness": {
            "baseColorFactor": [ 1.0, 1.0, 1.0, 1.0 ],
            "baseColorTexture": { "index": 0 },
            "roughnessFactor": 0.9,
            "metallicFactor": 0.0
        },
        "extensions": {
            "KHR_materials_unlit": {}
        }
    }
]

I implemented this by simply setting hasNormals and hasTangents, which generates a simple shader with no lighting.

Here is Suzanne with PBR.

before

And with the unlit extension.

after

Unlit materials are affected by shadows. This is viewer.shadows = true.

after_shadows

@lilleyse any feedback is welcome! This is the current shader that gets generated:

void main(void) 
{
    vec4 baseColorWithAlpha = u_baseColorFactor;
    vec3 baseColor = baseColorWithAlpha.rgb;
    vec3 color = baseColor;
    color += u_emissiveFactor;
    color = LINEARtoSRGB(color);
    gl_FragColor = vec4(color, 1.0);
}
  • Should it be using emissive factor?
  • Are there other potential code paths to test?
  • I couldn't find any tests for processPbrMetallicRoughness in this branch.

@cesium-concierge
Copy link

Thanks for the pull request @OmarShehata!

  • ✔️ Signed CLA found.

Reviewers, don't forget to make sure that:

  • Cesium Viewer works.
  • Works in 2D/CV.
  • Works (or fails gracefully) in IE11.

I am a bot who helps you make Cesium awesome! Contributions to my configuration are welcome.

🌍 🌎 🌏

@emackey
Copy link
Contributor

emackey commented Aug 30, 2018

@OmarShehata Unlit materials should not apply emissive. KhronosGroup/glTF#1391

@emackey
Copy link
Contributor

emackey commented Aug 30, 2018

Also KHR_materials_unlit should be added to the list of extensions allowed to appear in extensionsRequired. See ModelUtility.checkSupportedExtensions.

@OmarShehata
Copy link
Contributor Author

Thanks for the link @emackey ! I changed it to ignore emissive and occlusion as suggested there. The new shader looks like:

void main(void) 
{
    vec4 baseColorWithAlpha = u_baseColorFactor;
    vec3 baseColor = baseColorWithAlpha.rgb;
    vec3 color = baseColor;
    color = LINEARtoSRGB(color);
    gl_FragColor = vec4(color, 1.0);
}

Also KHR_materials_unlit should be added to the list of extensions allowed to appear in extensionsRequired. See ModelUtility.checkSupportedExtensions.

It should already be in there !

@ggetz
Copy link
Contributor

ggetz commented Aug 30, 2018

@OmarShehata There's no explcit tests for the processX functions as it was just moved out of gltf-pipeline, but ModelSpec.js tests for rendering pbr materials.

@emackey
Copy link
Contributor

emackey commented Aug 30, 2018

@OmarShehata This looks good to me. One last thing to be aware of, currently Cesium is known to not be following the glTF spec which calls for calculating missing normals (issue #6506). If/when that bug gets fixed, we should make sure that normals are not calculated for unlit materials.

@@ -660,6 +670,8 @@ define([
}
fragmentShader += '}\n';

console.log(fragmentShader);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Accidental debug code?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, sorry. Thanks for catching that!

}
else if (defined(generatedMaterialValues.u_emissiveFactor)) {
fragmentShader += ' color += u_emissiveFactor;\n';
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please run the auto-formatter on your blocks of changed code so that the source file stays consistently formatted.

}
else if (defined(generatedMaterialValues.u_emissiveFactor)) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

else and else if blocks go on the same line as the previous brace } else if Refer to the https://github.com/AnalyticalGraphicsInc/cesium/tree/master/Documentation/Contributors/CodingGuide

@OmarShehata
Copy link
Contributor Author

Thanks for the review Matt! @ggetz I added a test there to verify that it correctly renders the base color when using the unlit extension. I added a new glTF to test on. Since it was just a modified Box I put it in the same directory but let me know if that should go somewhere else.

Copy link
Contributor

@ggetz ggetz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @OmarShehata, just those comments.

@@ -2692,6 +2693,21 @@ defineSuite([
});
});

fit('renders with the unlit extension', function() {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Remove the fit

@@ -120,6 +120,7 @@ defineSuite([

var boomBoxUrl = './Data/Models/PBR/BoomBox/BoomBox.gltf';
var boxPbrUrl = './Data/Models/PBR/Box/Box.gltf';
var boxPbrUnlitUrl = './Data/Models/PBR/Box/Box-Unlit.gltf';
var boxAnimatedPbrUrl = './Data/Models/PBR/BoxAnimated/BoxAnimated.gltf';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Put the model in it's own folder like we do here. Also use camel case like we do for the other models. The path should be ./Data/Models/PBR/BoxUnlit/BoxUnlit.gltf. Just for consistency's sake.

@OmarShehata
Copy link
Contributor Author

I also tested this with a base texture instead of a base color and it seems to correctly render the unlit texture. Here's the produced shader in that case.

void main(void) 
{
    vec4 baseColorWithAlpha = SRGBtoLINEAR4(texture2D(u_baseColorTexture, v_texcoord_0));
    baseColorWithAlpha *= u_baseColorFactor;
    vec3 baseColor = baseColorWithAlpha.rgb;
    vec3 color = baseColor;
    color = LINEARtoSRGB(color);
    gl_FragColor = vec4(color, 1.0);
}

@emackey
Copy link
Contributor

emackey commented Aug 31, 2018

Base texture shader logic looks good, thanks.

@OmarShehata
Copy link
Contributor Author

@ggetz I've just verified that the CI errors in this branch are also erroring in the base branch. It's also peculiar because the test I added passes when ran individually but fails when ran together with the other tests in ModelSpec (I tried this with a few other tests in that file, so it's not just mine).

Do you know why/is this expected?

@lilleyse
Copy link
Contributor

lilleyse commented Sep 4, 2018

@OmarShehata the model tests can be a little weird at times and you may have missed resetting a model's show or something like that. Look at what other tests do to reset the state after they are finished.

@ggetz
Copy link
Contributor

ggetz commented Sep 4, 2018

@OmarShehata There's an error in a previous test for Model.js in that branch which causes all subsequent tests to fail. I saw your test pass individually so you should be fine.

CHANGES.md Outdated
@@ -10,6 +10,7 @@ Change Log
* Improved support for polygon entities using `perPositionHeight`, including supporting vertical polygons. This also improves KML compatibility. [#6791](https://github.com/AnalyticalGraphicsInc/cesium/pull/6791)
* Added `Cartesian3.midpoint` to compute the midpoint between two `Cartesian3` positions [#6836](https://github.com/AnalyticalGraphicsInc/cesium/pull/6836)
* Added `equalsEpsilon` methods to `OrthographicFrustum`, `PerspectiveFrustum`, `OrthographicOffCenterFrustum` and `PerspectiveOffCenterFrustum`.
* Added support for glTF extension [KHR_materials_unlit](https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_materials_unlit) [#6977](https://github.com/AnalyticalGraphicsInc/cesium/pull/6977).
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like this isn't targeting master, as the changelog is 2 versions out of date as of today's release.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah I'm merging into #6805 since that PR moves gltfPipeline from ThirdParty into Cesium core.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@OmarShehata Create a section for October's release and move your changes there. Thanks!

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh, I see the problem now. I moved it into a new section for October. Thanks for pointing this out!

@lilleyse
Copy link
Contributor

lilleyse commented Sep 5, 2018

Took a quick look as well, looks good!

@lilleyse lilleyse merged commit 604400d into CesiumGS:gltf-update-pipeline Sep 5, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants