CesiumGS / CesiumGS/cesium

Improve label quality on transparent background

Open
#8,155 8 comments 0 reactions 0 assignees View on GitHub
category - graphics theme - label/billboard quality type - bug
Dominant language
JavaScript
Stars
15.7k
Forks
3.9k
Avg merge
4d 6h
Merged PRs (30d)
34

Description

The use case here is having a CesiumJS app on a transparent background ([forum thread](https://groups.google.com/d/msg/cesium-dev/PO2DADrIS5c/OIENLd24AQAJ) where it came up). There seems to be some artifacts on the text labels. I've turned off the globe just to make this easier to see:

![1_61](https://user-images.githubusercontent.com/1711126/64783850-c6192e00-d536-11e9-80bd-568b60bda685.png)

[1.61 Sandcastle link](https://cesiumjs.org/Cesium/Apps/Sandcastle/index.html#c=hVVbb9owFP4rFi+lEjPrulGtZdW4VFolelHp9rCxh0N8klh17Mx2oKziv88XaBNYN6QAPuc79+84C9BkwXGJmnwiEpdkhIZXBf0WZO2DJBxHSlrgEvVBhzzNJCEgeQGWK3lKUhAGO144B4MTWKG+5ckD6roqrYQwiUaUw8raplmGKlGsic9VgftILlM1VI91kUlQ4pUz349pUGDic7yUjCdgVUNreYHClVSXVQbHmEIl7B1Kl9FEqfKUWF1FtYQFz0LVX1CU++mFXI7HN1KsalYmV5Vgg9CwRjSTA1NLU4dWTX8Pq91qH1YDWyhT5qgbvixq7QY03brcTDGefXvo+HI6GE4uxgGu8VeFZlOlV9eSKOCRF1URdfeuS6McZIbklFzKlEtuV3FqQs0bKSSOI/hob0rfIJdC4AkhS5xn4vnkmCPKHGK4KFr7H/e1PjybyZmMZKShl3QOyUOmVSXZSAnlKbopLBzp/d3geno7uLu4vj/bsdyr0Nn6mLu4VGUUJcwFslcQcUxXUP4PV8mhUKpw6tCUXX3Os3y8klDw5C409BWc2xLG7fPG/Rvm17RU2r6Gijs3LSHBERSowfvVSgiHiOV8jyn/taJ/GPvULIdpyaWzfkt7YXhpJcPGEWBsAnMU7cPt5KcgWQLGCqQMEwEa21uQH7yHbIKjtNxyNNTp28+8IaRUhgfnz/QegbbuH8hjmmpVjDFzCZv2m5MP9Kj3/qjXO+mQ44/044d3/nPYefElfFxSo2X8eAI76cFtzgUwt+Q5h4NOE5NyIQL9TptkHE6+Xrwg1xty+9rWvjW1+l1d90qJOegrlFX7x1Pc4Bh6wFjMLsZ1qxSuMafaNvelp6TW57OtqBbIU064x+602m/bz7huNbRGg4FIe3F2B6OxUAsciBh27Z5Wp9U3diXwPFp85kWgZaVFm9KuxaIU7voz3XnlrmlLE2O8ab+7NeozviCcfZq1dt44sxZxbDHGafxLZMp/oxMFMyd6uSDeJHEmy5xbx+TWeb/rXDY8CwWMy+xmgVrAykPyo/NJFFJK+1133LeycVQ1j38A)

This was actually vastly improved with the SDF text rendering. Here it is in 1.59:

![1_59](https://user-images.githubusercontent.com/1711126/64788480-86574400-d540-11e9-9e7b-1dbde942669d.png)

[1.59 Sandcastle link](https://cesiumjs.org/releases/1.59/Apps/Sandcastle/index.html#c=hVVtbxo5EP4rFl9CJGqayyVVCY1ugZwOafOiQFup5VSZ9eyuFa+9Z3shXMV/r1+A7C5Ni7SAZ555fWa8K6LQisEaFPqABKzRGDSrCvzJy7oniT+OpTCECVAnPfR9IRAighXEMCkGKCVcQ88Jl0RDTDagHljyBKquSivOdaIAxKgypmmWgUwkbeJzWcAxkolUjuRzXaQTEHBrzY9jauCQuByngrKEGNnQGlYAtyXVZZWGCaSk4uYRhM0olrIcIKOqoBZkxTJf9T/Ay+P0fC7nk3vBNzUrncuK08g3rBFN54TKta5Dq6a/p0272qdNZAqpyxxUw5cBpSxBs73LHYvh7NqDJ9NZNIpvJh6u4L8K9K5Kp64lUZBnVlRF0M1tl8Y5ERmgAZqKlAlmNoE1LpeNFBI7I/Bs7kvXIJuCnxOE1rDM+OFkJ4eXOQnhgmjrfuzX9vRqIRYiDCP2vcRLkjxlSlaCjiWXbkR3hfkjnj9Gd7OH6PHmbn7Vsjyq0Nq6mG1cKjMMgiw50FcQgaZbUv4OV4kRl7Kwat+Utj5nWT7ZCFKw5NE39BWc3RLKzGHjfg1za1pKZV5DhZ2blSSBMSlAEedXSc4tIpTzJaT804p+YexSM4zMSias9Vt86clLK+E3DhFKY7IE3j3dMz8jgiZEGw6YQsKJgu4e5Ih3kF1wEIYZBhpbffcwNwiVUjPv/DDeY6KM/UfEOU6VLCaQ2YR19827C3x2+efZ5eW7Hjp/j99f/OE+p70XX9zFRbWxDB83wFZ68pAzTqhd8pyRk14TIyvj7o3PjJp8gM5+rvXzOWhO6yj+eIPXzOSRW4HuW3xx2jLWZsPhYOV7M3Mi/Pc0jr9Fd5Nv9x/n8fTupmWXMs5fi/iC3O72zbV769iqUWJbPZeSL4m6BVF1v34Pl0roRkRpaFhohd1uf7Na1Z7vF5pRjfqrvagWyG0Bt49pse8ugH/DDVBDK9DgZ/soTntWFBRyBREPYbf26fQ6Q9/Q62DxFyv8plSKdzHuGyhKbm9k3V9W9s1hcKK1Mx3290ZDylaI0Q+LTusluOggO8BaW417r83Y/2BF3syKXu6sN0ngZJ0zY5ercz3sW5cNz1wSykR2vwLFycZB8rPrOAgxxsO+PR5bmUBVzeMP)

I'm just not sure where the remaining artifacts are coming from and what can be done to mitigate this here.

Contributor guide

Open the contributing guide

Research direction

Use the linked 1.61 Sandcastle example to reproduce the text-label artifacts on a transparent background, then compare its output with the linked 1.59 example. Done means the remaining artifacts are identified and mitigated, with the behavior verified in the reproduction.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
computer-graphics
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.