Google Map

google_map

The Google Map field is native to ACF (FREE) and provides an interactive map interface for selecting a location. This field type uses the Google Maps JS API to provide autocomplete searching, reverse geocoding lookup and an interactive marker.

Types Added to the Schema

To support the Google Map field, an additional Object Type is added to the Schema.

• AcfGoogleMap (object type): Object representing a google map, with fields such as latitude, longitude and more.

Resolve Type

The "google_map" field type resolves as "AcfGoogleMap" in the GraphQL Schema with latitude, longitude, and other fields.

Requirements

In order to use the Google Map field with ACF you must have a Google API key setup. You can read more about that in the ACF Google Map field documentation.

Field Settings

Below you will find information about how various ACF field settings can impact how the field will map to the GraphQL Schema and/or modify resolution of the field when queried.

Field Configuration

<?php
add_action( 'acf/include_fields', function() {
  if ( ! function_exists( 'acf_add_local_field_group' ) ) {
      return;
  }
  acf_add_local_field_group(
    [
      {
        "key": "my_field_group_",
        "title": "My Field Group with google_map",
        "show_in_graphql": 1,
        "graphql_field_name": "myFieldGroupWithGoogleMap",
        "map_graphql_types_from_location_rules": 0,
        "graphql_types": [
          "Page"
        ],
        "fields": [
          {
            "key": "my_field_",
            "label": "My Field",
            "name": "my_field",
            "type": "google_map",
            "show_in_graphql": 1,
            "graphql_field_name": "myFieldWithGoogleMap"
          }
        ],
        "location": [
          [
            {
              "param": "post_type",
              "operator": "==",
              "value": "page"
            }
          ]
        ]
      }
    ]
  );
});

Querying the Google Map field