Reputation: 63
I am playing around with mapbox one of the things im trying to figure out is how to set a name on a polygon that i have just created. I have a feature collection and for each feature i have a name but i cant figure out how to display the name on the polygon.
Upvotes: 2
Views: 3993
Reputation: 636
In general, if you'd like to display GeoJSON features along with labels in your Mapbox GL JS map, you will need to add two layers to your map referencing the GeoJSON source. One layer will be of type fill
to display the polygons themselves, and the other will be of type symbol
to display the text for the labels.
This example demonstrates how to add a symbol
layer with text-field
s containing the names of the Point
features in the GeoJSON source. If you have the coordinates for each polygon where you'd like the name to be displayed, you can follow this example to add the names after adding your polygons with a fill
layer.
Otherwise, you will need to compute the coordinates of the centroid of each polygon where you would like the names to be added. For this, you can use Turf's centroid
method on each polygon in your FeatureCollection
to generate said coordinates and add the symbol
layer representing each feature's name with the resulting coordinates.
Upvotes: 3