-
Notifications
You must be signed in to change notification settings - Fork 1.3k
"icon-allow-overlap: true, text-allow-overlap: true, text-optional: false" displays icons when it shouldn't #12483
Comments
/cc @ChrisLoer |
Hi @RomainQuidet can you include an equivalent screen capture from the 3.x SDK? I'm having trouble visualizing what the expected behavior is (and also which zoom levels are being crossed). There's a moment in the zoom-in animation where a bunch of the shield icons appear overlapping each other, but then fade out. That could be cross-fading happening because of crossing to a new integer zoom level, or that could be collision detection, I'm not sure. If you stayed at that zoom level where they show up, you'd expect them to all keep showing, but only having text labels for some of them. I don't see |
Hi @ChrisLoer, thanks for your quick reply! I'll make a video with the 3.x SDK, and try your suggestions about the text options. |
We don't want the text in shields to be optional. That's why we did not add those options. |
@ChrisLoer For information, our web team falls in the same issue. Here is the video |
Yeah that's true. In 3.x we did tile-based collision detection and we'd do all the collision detection for a tile before loading it. In 4.x we do global collision detection (see #10436), which sometimes requires showing tiles before collision detection has run on all their symbols. For symbols with mapbox-gl-native/src/mbgl/text/placement.cpp Lines 257 to 260 in 5fcd6e3
Until we fix the bug, does it work for you to just set cc @ansis |
Thanks again for this feedback. In the documentation for
By symbols, it means icons AND texts ? If I set My confusion comes from the symbol construction, including an icon+text, what parameters are best to avoid this shields symbols to overlap each other, but still be draw even if there is road name below? I'm also working with our server team for the styling. |
Yeah, these options can be confusing... 😕
For a single "symbol" in a symbol layer, the icon and the text are paired. The assumption is that they're meant to be shown together, so you don't have to worry about one of them colliding with the other.
I'm just guessing from the screenshots you attached, but this may be because the icons are bigger than their matching text. There was just enough room for the text to show, but not enough room for both the icon and the text to show. You can see what's happening with collision detection in GL JS by setting If my guess is right, you might be able to adjust the behavior by changing the
If you use The standard way to give "road shields" precedence over "road labels" is to place the road shield layer earlier in the style's layer order. That way the road shield gets placed first, and then when the road labels are being drawn, they'll be skipped if there's already a road shield taking their space. |
@ChrisLoer I'm assigning you since this seems to be related to your domain, symbols/collision - feel free to remove the assignment if you won't work on it. |
…a paired icon/text Fixes issue #12483.
…a paired icon/text Fixes issue #12483.
…a paired icon/text Fixes issue #12483.
Fixed in #12521. |
Hi,
We are using our own style and since mapbox iOS 4.x, our road shields rendering is incorrect (see video attached). Previous SDK 3.x were rendering the shields without flickering.
I also paste our shields style layer.
We are using icon-allow-overlap = true in the styling. When I remove this option, the rendering is not flickering anymore.
It seems to be a collision detection issue or a rendering priority vs collision issue.
Here is the style used:
{ "filter": [ "==", "shield_type", "4" ], "id": "shield_regional_label", "layout": { "icon-allow-overlap": true, "icon-image": "eu_shield_yellow_3.png", "icon-offset": [ 0, -0.7 ], "icon-padding": { "stops": [ [ 9.9, 80 ], [ 10.9, 70 ], [ 11.9, 60 ], [ 12.9, 50 ], [ 13.9, 30 ], [ 14.9, 2 ] ] }, "icon-rotation-alignment": "viewport", "symbol-avoid-edges": true, "symbol-placement": "line", "symbol-spacing": 350, "text-field": "{shield_text}", "text-font": [ "DejaVu Sans Condensed" ], "text-rotation-alignment": "viewport", "text-size": 9 }, "minzoom": 9, "paint": { "icon-opacity": 0.8, "text-color": "#000000" }, "source": "standard", "source-layer": "road_network", "type": "symbol" }
Steps to reproduce
Expected behavior
The shields are rendered without flickering
Actual behavior
the shields are flickering
Configuration
iOS/macOS versions: 4.x
Xcode version: 9.x
The text was updated successfully, but these errors were encountered: