Style a boundary polygon

Select platform: Android iOS JavaScript

To apply styles for stroke and fill to boundary polygons in a feature layer:

  1. Create a style factory function that implements the FeatureLayer.StyleFactory interface. This function defines the styling logic for a feature layer.

  2. Call FeatureLayer.setFeatureStyle() to apply the style factory function to the feature layer.

The following example map demonstrates highlighting the boundary polygon for a single region in a Locality feature layer.

A screenshot showing Hana Hawaii polygon.

Create a style factory function

The style factory function is applied to every polygon in the affected feature layer at the time you set the function on the feature layer. This function must return a FeatureStyle object that specifies how to style the polygon.

Maps SDK for Android passes a Feature instance to the style factory function. The Feature instance represents the feature's metadata, giving you access to the metadata in the style factory function.

The style factory function should always return consistent results when it is applied. For example, if you wanted to randomly color a set of features, the random part shouldn't take place in the feature style function, as that would cause unintended results.

Because this function runs over every feature in a layer, optimization is important. To avoid impacting rendering times:

  • Enable only the feature layers you need.

  • Call FeatureLayer.setFeatureStyle(null) when a feature layer is no longer in use.

Set polygon stroke and fill

When styling a boundary polygon in the style factory function, you can set the:

  • Stroke color and opacity of the polygon border in the ARGB color format, as defined by the Color class. The default value is transparent (0x00000000).

  • Stroke width of the polygon border in screen pixels. The default value is 2.

  • Fill color and opacity of the polygon in the ARGB color format, as defined by the Color class. The default value is transparent (0x00000000).

Lookup place IDs to target features

Many applications apply styles to a feature based on the feature location. For example, you might want to apply styling to different countries, territories, or regions. The feature location is represented by a place ID.

Place IDs uniquely identify a place in the Google Places database and on Google Maps. To get a place ID:

Coverage varies by region. See Google boundaries coverage for details.

Geographic names are available from many sources, such as the USGS Board on Geographic Names, and the U.S. Gazetteer Files.

Use PlaceFeature to get a place ID

The PlaceFeature class is a subclass of the Feature class. It represents a place feature (a feature with a place ID) which includes features of type ADMINISTRATIVE_AREA_LEVEL_1, ADMINISTRATIVE_AREA_LEVEL_2, COUNTRY, LOCALITY, POSTAL_CODE, and SCHOOL_DISTRICT.

When the place ID is available, the Maps SDK for Android passes an instance of PlaceFeature to the style factory function so that you can determine the location of the feature.

Style factory example

This example applies a style factory function to a polygon in the Locality feature layer. The style factory function determines the place ID of the feature by using the PlaceFeature instance. If the place ID is for Hana, Hawaii then the function applies a custom fill and stroke style to the polygon:

  1. If you haven't already done so, follow the steps in Get Started to create a new map ID and map style. Be sure to enable the Locality feature layer.

  2. Get a reference to the Locality feature layer when the map initializes.

    Java

    private FeatureLayer localityLayer;
    
@Override
public void onMapReady(GoogleMap map) {
  // Get the LOCALITY feature layer.
  localityLayer = map.getFeatureLayer(new FeatureLayerOptions.Builder()
    .featureType(FeatureType.LOCALITY)
    .build());
    
  // Apply style factory function to LOCALITY layer.
  styleLocalityLayer();
}

    Kotlin

    private var localityLayer: FeatureLayer? = null
    
override fun onMapReady(googleMap: GoogleMap) {
  // Get the LOCALITY feature layer.
  localityLayer = googleMap.getFeatureLayer(FeatureLayerOptions.Builder()
    .featureType(FeatureType.LOCALITY)
    .build())
    
  // Apply style factory function to LOCALITY layer.
  styleLocalityLayer()
}

  3. Create a style factory function and apply it to the Locality feature layer.

    The following example only applies the function if the place ID of the feature is for Hana, Hawaii ("ChIJ0zQtYiWsVHkRk8lRoB1RNPo"). If the specified place ID is not for Hana, Hawaii then the style is not applied.

    Java

    private void styleLocalityLayer() {
    
  // Create the style factory function.
  FeatureLayer.StyleFactory styleFactory = (Feature feature) -> {
    
    // Check if the feature is an instance of PlaceFeature,
    // which contains a place ID.
    if (feature instanceof PlaceFeature) {
      PlaceFeature placeFeature = (PlaceFeature) feature;
    
      // Determine if the place ID is for Hana, HI.
      if (placeFeature.getPlaceId().equals("ChIJ0zQtYiWsVHkRk8lRoB1RNPo")) {
    
        // Use FeatureStyle.Builder to configure the FeatureStyle object
        // returned by the style factory function.
        return new FeatureStyle.Builder()
          // Define a style with purple fill at 50% opacity and solid purple border.
          .fillColor(0x80810FCB)
          .strokeColor(0xFF810FCB)
          .build();
      }
    }
    return null;
  };
    
  // Apply the style factory function to the feature layer.
  localityLayer.setFeatureStyle(styleFactory);
}

    Kotlin

    private fun styleLocalityLayer() {
    
  // Create the style factory function.
  val styleFactory = FeatureLayer.StyleFactory { feature: Feature ->
    
      // Check if the feature is an instance of PlaceFeature,
      // which contains a place ID.
      if (feature is PlaceFeature) {
          val placeFeature: PlaceFeature = feature as PlaceFeature
    
          // Determine if the place ID is for Hana, HI.
          if (placeFeature.getPlaceId().equals("ChIJ0zQtYiWsVHkRk8lRoB1RNPo")) {
    
              // Use FeatureStyle.Builder to configure the FeatureStyle object
              // returned by the style factory function.
              return@StyleFactory FeatureStyle.Builder()
                  // Define a style with purple fill at 50% opacity and
                  // solid purple border.
                  .fillColor(0x80810FCB.toInt())
                  .strokeColor(0xFF810FCB.toInt())
                  .build()
          }
      }
      return@StyleFactory null
  }
    
  // Apply the style factory function to the feature layer.
  localityLayer?.setFeatureStyle(styleFactory)
}

Remove styling from a layer

To remove styling from a layer, call FeatureLayer.setFeatureStyle(null).