Symbols not rendered when textField property is specified

[jakubprogramming]

I am trying to add SVG or transparent PNG files as symbols onto the map.
For some reason I can only do this using png files without any transparency.
SVG icons won't work either.

The icons are simply not shown, no errors are given.

Is there a way to add transparent pngs or even better svgs as symbols to the map?

[jakubprogramming]

I also tried the Mapbox Maki Icons which I downloaded from: https://labs.mapbox.com/maki-icons/
Unfortunately without any success.

[jakubprogramming]

Furthermore, adding the textField property to symbol options will also result in symbols not being rendered:

This does not work;

return SymbolOptions(
     iconImage: iconPath,
     geometry: LatLng(latitude, longitude),
     iconSize: 0.1,
     textField: "test",
     textColor: iconColor,
     textOpacity: 1,
     textSize: 12,
     textAnchor: "bottom"
 );

This does work:

    return SymbolOptions(
        iconImage: iconPath,
        geometry: LatLng(latitude, longitude),
        iconSize: 0.1,
        //textField: "test", (removing textField will render symbol)
        textColor: iconColor,
        textOpacity: 1,
        textSize: 12,
        textAnchor: "bottom"
    );

[tobrun]

@jakubprogramming

SVG support is a feature that was recently added to mapbox-gl-native -> mapbox/mapbox-gl-native#16030 and isn't yet availlable in a stable platform release.

I also tried the Mapbox Maki Icons which I downloaded from: https://labs.mapbox.com/maki-icons/
Unfortunately without any success.

How are you adding these to your project? Are you adding them to the assets folder so they can be picked up? In the example app we have Place symbol page that has an option add (custom icon) that can be used as reference implementation.

Furthermore, adding the textField property to symbol options will also result in symbols not being rendered.

That is related to the default configuration of SymbolManager (eg. iconAllowOverlap etc). More context in #119 that would resolve this by exposing this as a configuration.

[jakubprogramming]

I was able to convert the maki Icons to PNG files and successfully use them (even with transparency) as symbols.
For what I understand from #119 it seems like currently text is simply not supported (if I understand correctly?!).

Anyway thanks a lot for your help!

[m0nac0]

@jakubprogramming Actually text is supported and works for me, does it still not work when you use PNG icons?

[jakubprogramming]

Hey @m0nac0,

No unfortunately text is not working whatsoever. Does not matter whether I include a PNG or no icon.

Do you think you could add a code snipped of your working symbolOptions?

[m0nac0]

The most simple example working for me is just

return SymbolOptions(
     iconImage: iconPath,
     geometry: LatLng(latitude, longitude),
     textField: "test",
 );

[jakubprogramming]

Oh well, something must be messed up here then.

For me this simple example does neither show a text nor an icon. When I remove the textField the icon is shown just fine. 😞

[m11an]

Hi, did anyone find a workaround, because I need to display the textField but the text is not rendered on map ?
IconImage is rendered on map but also when textField added the icon is not visible.

[GULERTOLGA]

Hi, did anyone find a workaround, because I need to display the textField but the text is not rendered on map ?
IconImage is rendered on map but also when textField added the icon is not visible.

@m11an Are you using one of the mapbox default styles? Or are you using a custom stylestring?

[m11an]

Hi, sorry for my late answer I found out that it was because of my custom stylestring it didn't load the fonts correctly. So I just load the default style from mapbox. @GULERTOLGA

[GULERTOLGA]

I exported the Mapbox default style string and pasted the glyphs and sprite lines inside my custom style string.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[MeloGon]

Hello, the same thing happens to me: "Symbols not rendered when textField property is specified". Has anyone managed to solve it as such?

[YuneshShrestha]

my symbol still does not show up when textField property is specified. Please guide me how to solve this.