Text-field for cluster layer break display of clusters

maplibre / maplibre-gl-js

MapLibre GL JS - Interactive vector tile maps in the browser

https://maplibre.org/maplibre-gl-js/docs/

Other

6.74k stars 726 forks source link

Text-field for cluster layer break display of clusters #2341

Open NorbWeb opened 1 year ago

NorbWeb commented 1 year ago

I tried to make an own cluster map out of example from docs. Cant make the labels of cluster be displayed. If I tried to just check the example in code pen, the problem occures there as well.

It may be an issue with the 'text-field': '{point_count_abbreviated}' in layout, because if I comment this line out, the clusters will be displayed on the map.

maplibre-gl-js version: 2.4.0

browser: Chrome, Firefox

Steps to Trigger Behavior

Undo the comment in line 55 from codepen example
clusters no longer be displayed

Link to Demonstration

link to codepen

Expected Behavior

Clusters with labels.

Actual Behavior

Clusters will not be displayed

HarelM commented 1 year ago

Thanks for taking the time to open this issue. I have no clue what causes this. I also don't know why this can be presented in the examples page properly while opening the jsbin or codepen from there doesn't work.

viapip commented 1 year ago

I tried to make an own cluster map out of example from docs. Cant make the labels of cluster be displayed. If I tried to just check the example in code pen, the problem occures there as well.

It may be an issue with the 'text-field': '{point_count_abbreviated}' in layout, because if I comment this line out, the clusters will be displayed on the map.

maplibre-gl-js version: 2.4.0

browser: Chrome, Firefox

Steps to Trigger Behavior

Undo the comment in line 55 from codepen example

clusters no longer be displayed

Link to Demonstration

link to codepen

Expected Behavior

Clusters with labels.

Actual Behavior

Clusters will not be displayed

Hi, I had the same issue and it turned out to be related to font connectivity. Now in the map settings of your example, I set to use the local font Roboto Regular and everything works. Also, it's likely that a separate server may be required for connecting multiple fonts. your example

HarelM commented 1 year ago

Please let me know if the analysis above is enough and this issue can be closed.

NorbWeb commented 1 year ago

Hi, I tried @pandochka-y solution, but it did not work for me. So, the local font thingy makes no difference, but there is something strange going on with the fonts itself. I tried different fonts with different results.

Works:

'text-font': ['Open Sans Regular'],
'text-font': ['Open Sans Bold'],
'text-font': ['Roboto Regular'],

Doesn't work:

Default https://maplibre.org/maplibre-style-spec/layers/#layout-symbol-text-font
'text-font': ["Open Sans Regular","Arial Unicode MS Regular"],
Text font from official example 'text-font': ['DIN Offc Pro Medium', 'Arial Unicode MS Bold'],

It's more a work-around and I have no clue why this occurs and what is the problem behind.

HarelM commented 1 year ago

Can you create a small reproduction of the issue? The smaller the better, preferably everything in the same html page (no external link to map style etc).

Placentra commented 3 weeks ago

I just have exactly the same issue. clusters are totaly not working, invisible. no matter what I try. And even when I just run the example code (without any change) from the guide page. Can anyone please remove this bug?

HarelM commented 3 weeks ago

I can make the cluster example work in codepen. I'm still waiting for a proper minimal reproduction. If the clusters shows but the text doesn't, I would recommend checking the fonts, if they are well defined and exist in the backend server.