diff --git a/CHANGES.md b/CHANGES.md index 5831f3a839c..a7497e57c40 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -7,6 +7,7 @@ #### Fixes :wrench: - Fixes an event bug following recent changes, where adding a new listener during an event callback caused an infinite loop. [#12955](https://github.com/CesiumGS/cesium/pull/12955) +- Fix issues with label background when updating properties while `label.show` is `false`. [#12138](https://github.com/CesiumGS/cesium/issues/12138) ## 1.134 - 2025-10-01 diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 1deb5e258e7..5c222d995c7 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -433,3 +433,4 @@ See [CONTRIBUTING.md](CONTRIBUTING.md) for details on how to contribute to Cesiu - [宋时旺](https://github.com/BlockCnFuture) - [Marco Zhan](https://github.com/marcoYxz) - [Mikhail Porotkin](https://github.com/porotkin) +- [Adam Beili](https://github.com/Beilinson) diff --git a/packages/engine/Source/Scene/LabelCollection.js b/packages/engine/Source/Scene/LabelCollection.js index 7475be1655b..a56cdeb8760 100644 --- a/packages/engine/Source/Scene/LabelCollection.js +++ b/packages/engine/Source/Scene/LabelCollection.js @@ -150,47 +150,25 @@ function rebindAllGlyphs(labelCollection, label) { // presize glyphs to match the new text length glyphs.length = textLength; - const showBackground = - label.show && label._showBackground && text.split("\n").join("").length > 0; let backgroundBillboard = label._backgroundBillboard; const backgroundBillboardCollection = labelCollection._backgroundBillboardCollection; - if (!showBackground) { - if (defined(backgroundBillboard)) { - backgroundBillboardCollection.remove(backgroundBillboard); - label._backgroundBillboard = backgroundBillboard = undefined; - } - } else { - if (!defined(backgroundBillboard)) { - backgroundBillboard = getWhitePixelBillboard( - backgroundBillboardCollection, - labelCollection, - ); - label._backgroundBillboard = backgroundBillboard; - } - backgroundBillboard.color = label._backgroundColor; - backgroundBillboard.show = label._show; - backgroundBillboard.position = label._position; - backgroundBillboard.eyeOffset = label._eyeOffset; - backgroundBillboard.pixelOffset = label._pixelOffset; - backgroundBillboard.horizontalOrigin = HorizontalOrigin.LEFT; - backgroundBillboard.verticalOrigin = label._verticalOrigin; - backgroundBillboard.heightReference = label._heightReference; - backgroundBillboard.scale = label.totalScale; - backgroundBillboard.pickPrimitive = label; - backgroundBillboard.id = label._id; - backgroundBillboard.translucencyByDistance = label._translucencyByDistance; - backgroundBillboard.pixelOffsetScaleByDistance = - label._pixelOffsetScaleByDistance; - backgroundBillboard.scaleByDistance = label._scaleByDistance; - backgroundBillboard.distanceDisplayCondition = - label._distanceDisplayCondition; - backgroundBillboard.disableDepthTestDistance = - label._disableDepthTestDistance; - backgroundBillboard.clusterShow = label.clusterShow; + // Create backgroundBillboard if needed + if (label._showBackground && !defined(backgroundBillboard)) { + backgroundBillboard = getWhitePixelBillboard( + backgroundBillboardCollection, + labelCollection, + ); + label._backgroundBillboard = backgroundBillboard; } + updateBackgroundBillboard( + backgroundBillboardCollection, + label, + backgroundBillboard, + ); + const glyphBillboardCollection = labelCollection._glyphBillboardCollection; const glyphTextureCache = glyphBillboardCollection.billboardTextureCache; const textDimensionsCache = labelCollection._textDimensionsCache; @@ -335,6 +313,47 @@ function rebindAllGlyphs(labelCollection, label) { label._repositionAllGlyphs = true; } +function updateBackgroundBillboard( + backgroundBillboardCollection, + label, + backgroundBillboard, +) { + if (!defined(backgroundBillboard)) { + return; + } + const showBackground = + label.show && + label._showBackground && + label._renderedText.split("\n").join("").length > 0; + // Label is shown and background is hidden - remove the background billboard + if (label.show && !showBackground) { + backgroundBillboardCollection.remove(backgroundBillboard); + label._backgroundBillboard = backgroundBillboard = undefined; + return; + } + + backgroundBillboard.color = label._backgroundColor; + backgroundBillboard.show = label._show; + backgroundBillboard.position = label._position; + backgroundBillboard.eyeOffset = label._eyeOffset; + backgroundBillboard.pixelOffset = label._pixelOffset; + backgroundBillboard.horizontalOrigin = HorizontalOrigin.LEFT; + backgroundBillboard.verticalOrigin = label._verticalOrigin; + backgroundBillboard.heightReference = label._heightReference; + backgroundBillboard.scale = label.totalScale; + backgroundBillboard.pickPrimitive = label; + backgroundBillboard.id = label._id; + backgroundBillboard.translucencyByDistance = label._translucencyByDistance; + backgroundBillboard.pixelOffsetScaleByDistance = + label._pixelOffsetScaleByDistance; + backgroundBillboard.scaleByDistance = label._scaleByDistance; + backgroundBillboard.distanceDisplayCondition = + label._distanceDisplayCondition; + backgroundBillboard.disableDepthTestDistance = + label._disableDepthTestDistance; + backgroundBillboard.clusterShow = label.clusterShow; +} + function calculateWidthOffset(lineWidth, horizontalOrigin, backgroundPadding) { if (horizontalOrigin === HorizontalOrigin.CENTER) { return -lineWidth / 2; @@ -507,7 +526,6 @@ function repositionAllGlyphs(label) { glyphPixelOffset.y = 0; } glyphPixelOffset.y = glyphPixelOffset.y * scale; - backgroundBillboard.width = totalLineWidth; backgroundBillboard.height = totalLineHeight; backgroundBillboard._setTranslate(glyphPixelOffset); diff --git a/packages/engine/Specs/Scene/LabelCollectionSpec.js b/packages/engine/Specs/Scene/LabelCollectionSpec.js index 74fdf4e8339..c9c2bd298c3 100644 --- a/packages/engine/Specs/Scene/LabelCollectionSpec.js +++ b/packages/engine/Specs/Scene/LabelCollectionSpec.js @@ -1148,6 +1148,26 @@ describe("Scene/LabelCollection", function () { }); describe("Label", function () { + it("should update background billboard when updating label properties while label is hidden", async function () { + const label = labels.add({ + text: "abc", + showBackground: true, + }); + + await allLabelsReady(); + expect(labels._backgroundBillboardCollection.length).toEqual(1); + + const backgroundBillboard = label._backgroundBillboard; + const { width } = backgroundBillboard; + + label.show = false; + label.text = "abcde"; + expect(labels._backgroundBillboardCollection.length).toEqual(1); + + label.show = true; + scene.renderForSpecs(); + expect(backgroundBillboard.width).toBeGreaterThan(width); + }); it("can compute screen space position", function () { labels.clampToPixel = false; const label = labels.add({