Fixed resolution scale for globe lighting and labels

CHANGES.md

@@ -1,6 +1,11 @@
 Change Log
 ==========
 
+### 1.63.1 - 2019-11-06
+
+##### Fixes :wrench:
+* Fixed regression in 1.63 where ground atmosphere and labels rendered incorrectly on displays with `window.devicePixelRatio` greater than 1.0. [#8351](https://github.com/AnalyticalGraphicsInc/cesium/pull/8351)
+
 ### 1.63 - 2019-11-01
 
 ##### Major Announcements :loudspeaker:

Source/Scene/Label.js

@@ -1133,12 +1133,11 @@ import VerticalOrigin from './VerticalOrigin.js';
         var width = 0;
         var height = 0;
         var scale = label.totalScale;
-        var resolutionScale = label._labelCollection._resolutionScale;
 
         var backgroundBillboard = label._backgroundBillboard;
         if (defined(backgroundBillboard)) {
-            x = screenSpacePosition.x + (backgroundBillboard._translate.x / resolutionScale);
-            y = screenSpacePosition.y - (backgroundBillboard._translate.y / resolutionScale);
+            x = screenSpacePosition.x + (backgroundBillboard._translate.x);
+            y = screenSpacePosition.y - (backgroundBillboard._translate.y);
             width = backgroundBillboard.width * scale;
             height = backgroundBillboard.height * scale;
 
@@ -1161,8 +1160,8 @@ import VerticalOrigin from './VerticalOrigin.js';
                     continue;
                 }
 
-                var glyphX = screenSpacePosition.x + (billboard._translate.x / resolutionScale);
-                var glyphY = screenSpacePosition.y - (billboard._translate.y / resolutionScale);
+                var glyphX = screenSpacePosition.x + (billboard._translate.x);
+                var glyphY = screenSpacePosition.y - (billboard._translate.y);
                 var glyphWidth = glyph.dimensions.width * scale;
                 var glyphHeight = glyph.dimensions.height * scale;
 

Source/Scene/LabelCollection.js

@@ -316,7 +316,7 @@ import GraphemeSplitter from '../ThirdParty/graphemesplitter.js';
     var glyphPixelOffset = new Cartesian2();
     var scratchBackgroundPadding = new Cartesian2();
 
-    function repositionAllGlyphs(label, resolutionScale) {
+    function repositionAllGlyphs(label) {
         var glyphs = label._glyphs;
         var text = label._renderedText;
         var glyph;
@@ -378,7 +378,7 @@ import GraphemeSplitter from '../ThirdParty/graphemesplitter.js';
             backgroundBillboard._labelHorizontalOrigin = horizontalOrigin;
         }
 
-        glyphPixelOffset.x = widthOffset * scale * resolutionScale;
+        glyphPixelOffset.x = widthOffset * scale;
         glyphPixelOffset.y = 0;
 
         var firstCharOfLine = true;
@@ -390,7 +390,7 @@ import GraphemeSplitter from '../ThirdParty/graphemesplitter.js';
                 lineOffsetY += lineSpacing;
                 lineWidth = lineWidths[lineIndex];
                 widthOffset = calculateWidthOffset(lineWidth, horizontalOrigin, backgroundPadding);
-                glyphPixelOffset.x = widthOffset * scale * resolutionScale;
+                glyphPixelOffset.x = widthOffset * scale;
                 firstCharOfLine = true;
             } else {
                 glyph = glyphs[glyphIndex];
@@ -409,12 +409,12 @@ import GraphemeSplitter from '../ThirdParty/graphemesplitter.js';
                     glyphPixelOffset.y = otherLinesHeight + maxGlyphDescent + backgroundPadding.y;
                     glyphPixelOffset.y -= SDFSettings.PADDING;
                 }
-                glyphPixelOffset.y = (glyphPixelOffset.y - dimensions.descent - lineOffsetY) * scale * resolutionScale;
+                glyphPixelOffset.y = (glyphPixelOffset.y - dimensions.descent - lineOffsetY) * scale;
 
                 // Handle any offsets for the first character of the line since the bounds might not be right on the bottom left pixel.
                 if (firstCharOfLine)
                 {
-                    glyphPixelOffset.x -= SDFSettings.PADDING * scale * resolutionScale;
+                    glyphPixelOffset.x -= SDFSettings.PADDING * scale;
                     firstCharOfLine = false;
                 }
 
@@ -430,7 +430,7 @@ import GraphemeSplitter from '../ThirdParty/graphemesplitter.js';
                 //as well as any applied scale.
                 if (glyphIndex < glyphLength - 1) {
                     var nextGlyph = glyphs[glyphIndex + 1];
-                    glyphPixelOffset.x += ((dimensions.width - dimensions.bounds.minx) + nextGlyph.dimensions.bounds.minx) * scale * resolutionScale;
+                    glyphPixelOffset.x += ((dimensions.width - dimensions.bounds.minx) + nextGlyph.dimensions.bounds.minx) * scale;
                 }
             }
         }
@@ -443,7 +443,7 @@ import GraphemeSplitter from '../ThirdParty/graphemesplitter.js';
             } else {
                 widthOffset = 0;
             }
-            glyphPixelOffset.x = widthOffset * scale * resolutionScale;
+            glyphPixelOffset.x = widthOffset * scale;
 
             if (verticalOrigin === VerticalOrigin.TOP) {
                 glyphPixelOffset.y = maxLineHeight - maxGlyphY - maxGlyphDescent;
@@ -455,7 +455,7 @@ import GraphemeSplitter from '../ThirdParty/graphemesplitter.js';
                 // VerticalOrigin.BOTTOM
                 glyphPixelOffset.y = 0;
             }
-            glyphPixelOffset.y = glyphPixelOffset.y * scale * resolutionScale;
+            glyphPixelOffset.y = glyphPixelOffset.y * scale;
 
             backgroundBillboard.width = totalLineWidth;
             backgroundBillboard.height = totalLineHeight;
@@ -566,7 +566,6 @@ import GraphemeSplitter from '../ThirdParty/graphemesplitter.js';
         this._labels = [];
         this._labelsToUpdate = [];
         this._totalGlyphCount = 0;
-        this._resolutionScale = undefined;
 
         this._highlightColor = Color.clone(Color.WHITE); // Only used by Vector3DTilePoints
 
@@ -844,21 +843,9 @@ import GraphemeSplitter from '../ThirdParty/graphemesplitter.js';
             addWhitePixelCanvas(this._backgroundTextureAtlas, this);
         }
 
-        var uniformState = context.uniformState;
-        var resolutionScale = uniformState.pixelRatio;
-        var resolutionChanged = this._resolutionScale !== resolutionScale;
-        this._resolutionScale = resolutionScale;
-
-        var labelsToUpdate;
-        if (resolutionChanged) {
-            labelsToUpdate = this._labels;
-        } else {
-            labelsToUpdate = this._labelsToUpdate;
-        }
-
-        var len = labelsToUpdate.length;
+        var len = this._labelsToUpdate.length;
         for (var i = 0; i < len; ++i) {
-            var label = labelsToUpdate[i];
+            var label = this._labelsToUpdate[i];
             if (label.isDestroyed()) {
                 continue;
             }
@@ -870,8 +857,8 @@ import GraphemeSplitter from '../ThirdParty/graphemesplitter.js';
                 label._rebindAllGlyphs = false;
             }
 
-            if (resolutionChanged || label._repositionAllGlyphs) {
-                repositionAllGlyphs(label, resolutionScale);
+            if (label._repositionAllGlyphs) {
+                repositionAllGlyphs(label);
                 label._repositionAllGlyphs = false;
             }
 

Source/Shaders/BillboardCollectionVS.glsl

@@ -83,26 +83,10 @@ vec4 addScreenSpaceOffset(vec4 positionEC, vec2 imageSize, float scale, vec2 dir
     }
 #endif
 
-    if (sizeInMeters)
-    {
-        positionEC.xy += halfSize;
-    }
-
     mpp = czm_metersPerPixel(positionEC);
+    positionEC.xy += (originTranslate + halfSize) * czm_branchFreeTernary(sizeInMeters, 1.0, mpp);
+    positionEC.xy += (translate + pixelOffset) * mpp;
 
-    if (!sizeInMeters)
-    {
-        originTranslate *= mpp;
-    }
-
-    positionEC.xy += originTranslate;
-    if (!sizeInMeters)
-    {
-        positionEC.xy += halfSize * mpp;
-    }
-
-    positionEC.xy += translate * mpp;
-    positionEC.xy += pixelOffset * mpp;
     return positionEC;
 }
 

Source/Shaders/Builtin/Functions/metersPerPixel.glsl

@@ -1,14 +1,17 @@
 /**
  * Computes the size of a pixel in meters at a distance from the eye.
-
+ * <p>
+ * Use this version when passing in a custom pixel ratio. For example, passing in 1.0 will return meters per native device pixel.
+ * </p>
  * @name czm_metersPerPixel
  * @glslFunction
  *
  * @param {vec3} positionEC The position to get the meters per pixel in eye coordinates.
+ * @param {float} pixelRatio The scaling factor from pixel space to coordinate space
  *
  * @returns {float} The meters per pixel at positionEC.
  */
-float czm_metersPerPixel(vec4 positionEC)
+float czm_metersPerPixel(vec4 positionEC, float pixelRatio)
 {
     float width = czm_viewport.z;
     float height = czm_viewport.w;
@@ -37,5 +40,22 @@ float czm_metersPerPixel(vec4 positionEC)
         pixelWidth = 2.0 * distanceToPixel * tanTheta / width;
     }
 
-    return max(pixelWidth, pixelHeight) * czm_pixelRatio;
+    return max(pixelWidth, pixelHeight) * pixelRatio;
+}
+
+/**
+ * Computes the size of a pixel in meters at a distance from the eye.
+ * <p>
+ * Use this version when scaling by pixel ratio.
+ * </p>
+ * @name czm_metersPerPixel
+ * @glslFunction
+ *
+ * @param {vec3} positionEC The position to get the meters per pixel in eye coordinates.
+ *
+ * @returns {float} The meters per pixel at positionEC.
+ */
+float czm_metersPerPixel(vec4 positionEC)
+{
+    return czm_metersPerPixel(positionEC, czm_pixelRatio);
 }

Source/Shaders/Builtin/Functions/writeLogDepth.glsl

@@ -5,7 +5,7 @@ varying float v_logZ;
 /**
  * Writes the fragment depth to the logarithmic depth buffer.
  * <p>
- * Use this when the vertex shader does not calls {@link czm_vertexlogDepth}, for example, when
+ * Use this when the vertex shader does not call {@link czm_vertexlogDepth}, for example, when
  * ray-casting geometry using a full screen quad.
  * </p>
  * @name czm_writeLogDepth

Source/Shaders/GlobeFS.glsl

@@ -376,7 +376,7 @@ void main()
     }
 
 #if defined(PER_FRAGMENT_GROUND_ATMOSPHERE) && (defined(ENABLE_DAYNIGHT_SHADING) || defined(ENABLE_VERTEX_LIGHTING))
-    float mpp = czm_metersPerPixel(vec4(0.0, 0.0, -czm_currentFrustum.x, 1.0));
+    float mpp = czm_metersPerPixel(vec4(0.0, 0.0, -czm_currentFrustum.x, 1.0), 1.0);
     vec2 xy = gl_FragCoord.xy / czm_viewport.zw * 2.0 - vec2(1.0);
     xy *= czm_viewport.zw * mpp * 0.5;