GroundPrimitives are broken in orthographic projection

[bagnell]

Most likely a clipping or depth clamping issue.

See #5021 (comment)

[he-hesce]

Dear CesiumJS developers,

We think we are experiencing this issue. We have an in-house bespoke piece of software which is a tool developed in C++ and Qt5 for scientific time-series analysis and visualization. We are working (slowly) since some years in enhancing this tool with state-of-the-art mapping. Due to Qt5’s very limited facility is this area (QtLocation is basically useless for interactivity), we have opted to develop a map widget using QtWebKit with CesiumJS as that would enable the interactivity with the map which the users require.

However, after some initial success in using our Natural Earth base layers and bespoke overlays, we ran into an issue when we try to plot primitives such as billboards (symbols), labels, and polylines (great-circle paths) on the flat surface (later on we will also plot ellipses, azimuths, and distance circles using ellipses and/or polylines primitives). Things look fine when we use the perspective projection but our users need to use the orthographic projection and that is when we run into an issue which looks like clipping at the horizon of the globe. For troubleshooting, we tried raising the height from zero meters to some thousand meters but the clipping issue is still there. We also tried both QtWebKit "5.5" shipping with EPEL-7 (for CentOS) and QtWebKit 5.212 shipping with EPEL-8 (for CentOS) and in Ubuntu 18.04 in case it was a WebGL issue but it appears in both the older and latest QtWebKit. We have tried CesiumJS from version 1.52 up to the latest 1.65 and they all experience the issue.

Two screenshots are attached showing both how it looks fine in perspective projection and how the billboards and polylines are not clipped when they are supposed to disappear behind the horizon in orthographic projection.

Is anyone looking at this issue and thinking of addressing it?

Attachments:

Perspective Projection:

Orthographic Projection:

[OmarShehata]

@he-hesce thanks for adding your debugging details to this issue. Would you be able to put together a Sandcastle example showing this issue that you can share here?

[he-hesce]

Dear @OmarShehata et al,

Please find attached a Sandcastle example. This can be pasted into the JavaScript code tab in the Hello World example. It only shows the issue with polylines but it also applies to other primitives as described above. Look for the non-clipping at the horizon. I've also attached a screenshot from Sandcastle.

Cheers,
HE

sandcastle-orthographic-projection-horizon-clipping-issue.txt

[OmarShehata]

Thanks @he-hesce, I am able to reproduce this. Here's a runnable Sandcastle of this issue (you can press "share" at the top and get a sharable link).

[he-hesce]

Thanks @OmarShehata. I tried the share/copy button but I got nothing in my pastebuffer. I was using Safari so perhaps the page was blocked from writing to the pastebuffer/clipboard.

Fixing this in CesiumJS is beyond me so we would really appreciate the help from the Cesium community of developers as this is kind of a show stopper for us when (surface) primitives are not working properly with orthographic projection which is the one projection we need to use for scientific purposes.

[he-hesce]

Is there any company or self-employed developer out there who is able to fix this issue but is lacking time/compensation?

[sowo]

We're having the same problem and would highly appreciate this to be addressed.
Thank you

[he-hesce]

Is there nobody at the Cesium company using orthographic projection and/or interested in addressing this long-standing issue?

[OmarShehata]

@he-hesce as far as I am aware, orthographic projection in CesiumJS is less commonly used. We'd love to see this fixed but I don't have a timeline of when we'll be able to investigate.

If you or other WebGL developers from the community want to take a look and contribute a fix we'd be happy to review a PR.

[he-hesce]

@OmarShehata: Thanks for the update. My expertise is not in WebGL or the area of this bug :-/ so I am afraid I cannot help much resolving this clipping/frustum issue. Believe me, if I could fix it, there would already be a PR.

[IanLilleyT]

@he-hesce and @sowo Can you check if #8854 fixes your problems? Thanks!

[he-hesce]

@IanLilleyT: Thanks for looking into this issue. I tried your patch but it doesn't seem to fix the issue we're having. I'm attaching a screenshot how it still looks when using your new code with Orthographic projection:

Here is the same "view" but with Perspective and you can see how the polylines (and billboards) are properly clipped behind the horizon:

@OmarShehata helped me set up a Sandcastle example (see link in a comment above) which perhaps you can test with as well.

[OmarShehata]

@IanLilleyT Sandcastle is here. Just rotate the globe a bit to get the line over the horizon as in the pictures.

[IanLilleyT]

Thanks! Looking into it now.

[IanLilleyT]

It turns out the polyline issue we've been talking about is not related to ground primitives, which is why #8854 didn't make a difference. Instead, it's related to a different recent PR: #8850.

The problem was View was not updating correctly when switching to orthographic.

@he-hesce can you try #8850 instead and see if it fixes the problem?

[he-hesce]

@IanLilleyT: Thanks for your continued effort on this plaguing issue. I tried Cesium-1.69.0-orthoCameraFixBounds34391.zip attached to #8850 but the horizon clipping issue is still there:

[IanLilleyT]

hmm... does this sandcastle work for you? It works for me with #8850.

[he-hesce]

If I click that link I get a Sandcastle which doesn't work. Is it pointing to and using the CesiumJS from #8850? It is easier to see the issue turning off the atmosphere and horizon haze like we do in our bespoke application.

This is how sandcastle in previous comment looks for me in Safari 13.1:

Do note that in our bespoke application (previous screenshots with the Map window title) we are using QtWebKit 5.9.1 (the one shipping with EPEL-7 for CentOS 7.7). I cannot load the Sandcastle URL into our embedded QtWebKit browser so that is why I tested the Sandcastle link in Safari.

Previously I have also replicated the issue with QtWebKit 5.212 shipping with EPEL-8 (for CentOS 8.x) and in Ubuntu 18.04.

[IanLilleyT]

Thanks for the info. I think I was misunderstanding the problem this whole time! (There was a different orthographic polyline bug I recently fixed). So the problem is the line dipping below the horizon? As seen here.

Before:

After:

Is that correct?

The way I fixed it was by doing:
viewer.scene.globe.depthTestAgainstTerrain = true

But I'm pretty sure there's a way to fix this without having to use that code. And it has to do with the depth plane most likely. I'll see where that takes me.

[he-hesce]

Yes, indeed. viewer.scene.globe.depthTestAgainstTerrain = true does indeed fix this issue in orthographic projection with polylines not clipping properly at/behind the horizon. It was never an issue in perspective projection. Even though this now makes me happy as it it fixes our issue with polylines, I still think this shouldn't happen at all as I think it is a plotting/rendering problem for these primitives in orthographic projection and should never happen. Who would want this to happen and be a "feature"?

However, switching on viewer.scene.globe.depthTestAgainstTerrain now makes our billboards (the black triangles) look crap. And now both in perspective and orthographic projection. See screenshots below:

Perspective:

Orthographic:

[he-hesce]

And with viewer.scene.globe.depthTestAgainstTerrain = true, when zooming in closer to the surface the following happens:

Orthographic:

Perspective:

[he-hesce]

With viewer.scene.globe.depthTestAgainstTerrain = false, when zooming in closer to the surface it looks fine.

Orthographic:

[IanLilleyT]

viewer.scene.globe.depthTestAgainstTerrain = true is only a proof-of-concept fix. I wouldn't expect you to use it as the final solution due to all the drawbacks you pointed out.

It's not a problem with primitives and projection, it's a problem with this invisible depth plane that is supposed to block objects behind the horizon, but it's in the wrong location for orthographic. So hopefully the fix isn't too complicated and you won't have to change your code.

[he-hesce]

@IanLilleyT: Sounds like you're onto a solution. 🥇 Thanks for all your effort in resolving this.

[IanLilleyT]

Third time's the charm? This PR might be the real fix to the problem: #8858. No need to use viewer.scene.globe.depthTestAgainstTerrain = true any more.

[he-hesce]

@IanLilleyT: You're a rockstar 👍 #8858 does indeed appear to resolve our sub-issue. This looks correct now, there is no clipping problem on the horizon and also looks fine zoomed in:

Our users/scientists will be very happy with their new fancy orthographic projection view.

Hope this can make it officially into the next CesiumJS release.

Thank you!

[he-hesce]

Maybe we were yelling victory too early. If I tilt the globe (ctrl-click + mouse move) then it seems the issue reappear. :-/

[IanLilleyT]

Oof.. I reproduced the issue and submitted some fixes for it. Could you try #8858 again? Thanks!

[he-hesce]

@IanLilleyT: I have tried Cesium-1.69.0-orthoDepthPlaneFix34405.zip and will say (cautiously this time) that it does seem to work fine now, tilted or not tilted. I've been rotating, tilting, zooming, and trying to break it but it does seem to look fine in all circumstances and I cannot make it to look "unclipped". So this could be it!

[he-hesce]

Hope to see this fix in 1.70! Cheers to all involved!

[sowo]

I've tested the fix as well and can confirm that it resolves my issue. Thanks to everybody involved in resolving this.