2

I am working with the LineLayer from Mapbox SDK and having problems with getting text to show up on the line. There is an example from Mapbox.

This is what I have so far:

// Create a list to store our line coordinates.
routeCoordinates = new ArrayList<>();
routeCoordinates.add(Point.fromLngLat(-95.9928, 36.1540));
routeCoordinates.add(Point.fromLngLat(-95.9870, 36.1397));

// Create the LineString from the list of coordinates and then make a GeoJSON
// FeatureCollection so we can add the line to our map as a layer.
LineString lineString = LineString.fromLngLats(routeCoordinates);
FeatureCollection featureCollection = FeatureCollection.fromFeatures(new com.mapbox.geojson.Feature[] {com.mapbox.geojson.Feature.fromGeometry(lineString)});
Source geoJsonSource = new GeoJsonSource("line-source", featureCollection);
mapbox.addSource(geoJsonSource);

LineLayer lineLayer = new LineLayer("linelayer", "line-source");
// The layer properties for our line. This is where we make the line dotted, set the
// color, etc.
lineLayer.setProperties(
     PropertyFactory.lineCap(Property.LINE_CAP_ROUND),
     PropertyFactory.lineJoin(Property.LINE_JOIN_ROUND),
     PropertyFactory.lineWidth(5f),
     PropertyFactory.lineColor(Color.parseColor("#e55e5e")),
     PropertyFactory.textField("some text"),
     PropertyFactory.textColor(Color.parseColor("#ffffff"))
);
mapbox.addLayer(lineLayer);

It won't add the string to the line as shown below.

enter image description here

lobuli
  • 109
  • 1
  • 9

1 Answers1

2

The LineLayer class is based on the line layer in Mapbox GL JS. You can see available properties of this type of layer here, in the style spec documentation. As you can see, textField and textColor are not available properties.

One way to accomplish this would be to create an additional layer - this time of type SymbolLayer (https://docs.mapbox.com/android/api/map-sdk/7.0.0/com/mapbox/mapboxsdk/style/layers/SymbolLayer.html). This layer would have the same line data from your GeoJsonSource. You can read more about symbol layers here, but you can set text for this layer, and then set the symbol-placement property to line or line-center so the text aligns properly.

samfader
  • 161
  • 4