Fix translucent picking

CHANGES.md

@@ -8,6 +8,7 @@ Change Log
 * Added `OpenCageGeocoderService`, which provides geocoding via [OpenCage](https://opencagedata.com/). [#7015](https:/AnalyticalGraphicsInc/cesium/pull/7015)
 
 ##### Fixes :wrench:
+* Fixed picking for overlapping translucent primitives. [#7039](https:/AnalyticalGraphicsInc/cesium/pull/7039)
 * Fixed an issue in the 3D Tiles traversal where external tilesets would not always traverse to their root tile. [#7035](https:/AnalyticalGraphicsInc/cesium/pull/7035)
 * Fixed an issue in the 3D Tiles traversal where empty tiles would be selected instead of their nearest loaded ancestors. [#7011](https:/AnalyticalGraphicsInc/cesium/pull/7011)
 * Fixed an issue where scaling near zero with an model animation could cause rendering to stop. [#6954](https:/AnalyticalGraphicsInc/cesium/pull/6954)

Source/Scene/DerivedCommand.js

@@ -289,6 +289,7 @@ define([
  if (!defined(pickState)) {
  var rs = RenderState.getState(renderState);
  rs.blending.enabled = false;
+ rs.depthMask = true;
 
  pickState = RenderState.fromCache(rs);
  cache[renderState.id] = pickState;

Source/Scene/Scene.js

@@ -1841,14 +1841,19 @@ define([
  }
  }
 
- function translucentCompare(a, b, position) {
+ function backToFront(a, b, position) {
  return b.boundingVolume.distanceSquaredTo(position) - a.boundingVolume.distanceSquaredTo(position);
  }
 
- function executeTranslucentCommandsSorted(scene, executeFunction, passState, commands, invertClassification) {
+ function frontToBack(a, b, position) {
+ // When distances are equal equal favor sorting b before a. This gives render priority to commands later in the list.
+ return a.boundingVolume.distanceSquaredTo(position) - b.boundingVolume.distanceSquaredTo(position) + CesiumMath.EPSILON12;
+ }
+
+ function executeTranslucentCommandsBackToFront(scene, executeFunction, passState, commands, invertClassification) {
  var context = scene.context;
 
- mergeSort(commands, translucentCompare, scene.camera.positionWC);
+ mergeSort(commands, backToFront, scene.camera.positionWC);
 
  if (defined(invertClassification)) {
  executeFunction(invertClassification.unclassifiedCommand, scene, context, passState);
@@ -1860,9 +1865,11 @@ define([
  }
  }
 
- function executeTranslucentCommandsUnsorted(scene, executeFunction, passState, commands, invertClassification) {
+ function executeTranslucentCommandsFrontToBack(scene, executeFunction, passState, commands, invertClassification) {
  var context = scene.context;
 
+ mergeSort(commands, frontToBack, scene.camera.positionWC);
+
  if (defined(invertClassification)) {
  executeFunction(invertClassification.unclassifiedCommand, scene, context, passState);
  }
@@ -1975,9 +1982,9 @@ define([
  }
  executeTranslucentCommands = scene._executeOITFunction;
  } else if (passes.render) {
- executeTranslucentCommands = executeTranslucentCommandsSorted;
+ executeTranslucentCommands = executeTranslucentCommandsBackToFront;
  } else {
- executeTranslucentCommands = executeTranslucentCommandsUnsorted;
+ executeTranslucentCommands = executeTranslucentCommandsFrontToBack;
  }
 
  var clearGlobeDepth = environmentState.clearGlobeDepth;