किसी पता फ़ॉर्म में स्थान ऑटोकंप्लीट जोड़ना

डिलीवरी का पता, बिलिंग की जानकारी या इवेंट की जानकारी भरते समय, जगह के नाम अपने-आप पूरे होने की सुविधा वाले फ़ॉर्म चालू करने से, उपयोगकर्ताओं को पते की जानकारी डालते समय कम कीस्ट्रोक का इस्तेमाल करने और गलतियां कम करने में मदद मिलती है. इस ट्यूटोरियल में, Place Autocomplete की सुविधा वाले इनपुट फ़ील्ड को चालू करने का तरीका बताया गया है. साथ ही, इसमें उपयोगकर्ता के चुने गए पते के कॉम्पोनेंट से, पते के फ़ॉर्म फ़ील्ड भरने और चुने गए पते को मैप पर दिखाने का तरीका बताया गया है, ताकि पुष्टि करने में आसानी हो.

वीडियो: पते के फ़ॉर्म को बेहतर बनाने के लिए, जगह के नाम अपने-आप भरने की सुविधा का इस्तेमाल करना

पते के फ़ॉर्म

Android

iOS

वेब

Google Maps Platform, मोबाइल प्लैटफ़ॉर्म और वेब के लिए Place Autocomplete विजेट उपलब्ध कराता है. पिछली इमेज में दिखाया गया विजेट, खोज के लिए एक डायलॉग बॉक्स उपलब्ध कराता है. इसमें ऑटोकंप्लीट की सुविधा पहले से मौजूद होती है. इसे जगह के हिसाब से खोज के लिए भी ऑप्टिमाइज़ किया जा सकता है.

कोड प्राप्त करें

GitHub से Google Places SDK for Android Demos repository को क्लोन करें या डाउनलोड करें.

गतिविधि का Java वर्शन देखने के लिए:

कोड दिखाएं / छिपाएं

    /*
 * Copyright 2022 Google LLC
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     https://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

package com.example.placesdemo;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Intent;
import android.content.pm.PackageManager;
import android.content.res.Resources;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.ViewStub;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.Toast;

import androidx.activity.result.ActivityResultLauncher;
import androidx.activity.result.contract.ActivityResultContracts;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
import androidx.core.content.ContextCompat;

import com.example.placesdemo.databinding.AutocompleteAddressActivityBinding;
import com.google.android.gms.location.FusedLocationProviderClient;
import com.google.android.gms.location.LocationServices;
import com.google.android.gms.maps.CameraUpdateFactory;
import com.google.android.gms.maps.GoogleMap;
import com.google.android.gms.maps.GoogleMapOptions;
import com.google.android.gms.maps.OnMapReadyCallback;
import com.google.android.gms.maps.SupportMapFragment;
import com.google.android.gms.maps.model.LatLng;
import com.google.android.gms.maps.model.MapStyleOptions;
import com.google.android.gms.maps.model.Marker;
import com.google.android.gms.maps.model.MarkerOptions;
import com.google.android.libraries.places.api.Places;
import com.google.android.libraries.places.api.model.AddressComponent;
import com.google.android.libraries.places.api.model.AddressComponents;
import com.google.android.libraries.places.api.model.Place;
import com.google.android.libraries.places.api.model.TypeFilter;
import com.google.android.libraries.places.api.net.PlacesClient;
import com.google.android.libraries.places.widget.Autocomplete;
import com.google.android.libraries.places.widget.model.AutocompleteActivityMode;

import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;

import static android.Manifest.permission.ACCESS_FINE_LOCATION;
import static com.google.maps.android.SphericalUtil.computeDistanceBetween;
import androidx.activity.EdgeToEdge;

/**
 * Activity for using Place Autocomplete to assist filling out an address form.
 */
@SuppressWarnings("FieldCanBeLocal")
public class AutocompleteAddressActivity extends AppCompatActivity implements OnMapReadyCallback {

    private static final String TAG = "ADDRESS_AUTOCOMPLETE";
    private static final String MAP_FRAGMENT_TAG = "MAP";
    private LatLng coordinates;
    private boolean checkProximity = false;
    private SupportMapFragment mapFragment;
    private GoogleMap map;
    private Marker marker;
    private PlacesClient placesClient;
    private View mapPanel;
    private LatLng deviceLocation;
    private static final double acceptedProximity = 150;

    private AutocompleteAddressActivityBinding binding;

    View.OnClickListener startAutocompleteIntentListener = view -> {
        view.setOnClickListener(null);
        startAutocompleteIntent();
    };

    private final ActivityResultLauncher<Intent> startAutocomplete = registerForActivityResult(
            new ActivityResultContracts.StartActivityForResult(),
            result -> {
                if (result.getResultCode() == Activity.RESULT_OK) {
                    Intent intent = result.getData();
                    if (intent != null) {
                        Place place = Autocomplete.getPlaceFromIntent(intent);

                        // Write a method to read the address components from the Place
                        // and populate the form with the address components
                        Log.d(TAG, "Place: " + place.getAddressComponents());
                        fillInAddress(place);
                    }
                } else if (result.getResultCode() == Activity.RESULT_CANCELED) {
                    // The user canceled the operation.
                    Log.i(TAG, "User canceled autocomplete");
                }
            });

    @Override
    protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent intent) {
        super.onActivityResult(requestCode, resultCode, intent);
        binding.autocompleteAddress1.setOnClickListener(startAutocompleteIntentListener);
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        // Enable edge-to-edge display. This must be called before calling super.onCreate().
        EdgeToEdge.enable(this);
        super.onCreate(savedInstanceState);

        binding = AutocompleteAddressActivityBinding.inflate(getLayoutInflater());
        setContentView(binding.getRoot());

        // Retrieve a PlacesClient (previously initialized - see MainActivity)
        placesClient = Places.createClient(this);

        // Attach an Autocomplete intent to the Address 1 EditText field
        binding.autocompleteAddress1.setOnClickListener(startAutocompleteIntentListener);

        // Update checkProximity when user checks the checkbox
        CheckBox checkProximityBox = findViewById(R.id.checkbox_proximity);
        checkProximityBox.setOnCheckedChangeListener((view, isChecked) -> {
            // Set the boolean to match user preference for when the Submit button is clicked
            checkProximity = isChecked;
        });

        // Submit and optionally check proximity
        Button saveButton = findViewById(R.id.autocomplete_save_button);
        saveButton.setOnClickListener(v -> saveForm());

        // Reset the form
        Button resetButton = findViewById(R.id.autocomplete_reset_button);
        resetButton.setOnClickListener(v -> clearForm());
    }

    private void startAutocompleteIntent() {

        // Set the fields to specify which types of place data to
        // return after the user has made a selection.
        List<Place.Field> fields = Arrays.asList(Place.Field.ADDRESS_COMPONENTS,
                Place.Field.LAT_LNG, Place.Field.VIEWPORT);

        // Build the autocomplete intent with field, country, and type filters applied
        Intent intent = new Autocomplete.IntentBuilder(AutocompleteActivityMode.OVERLAY, fields)
                .setCountries(Arrays.asList("US"))
                .setTypesFilter(new ArrayList<String>() {{
                    add(TypeFilter.ADDRESS.toString().toLowerCase());
                }})
                .build(this);
        startAutocomplete.launch(intent);
    }

    @Override
    public void onMapReady(@NonNull GoogleMap googleMap) {
        map = googleMap;
        try {
            // Customise the styling of the base map using a JSON object defined
            // in a string resource.
            boolean success = map.setMapStyle(
                    MapStyleOptions.loadRawResourceStyle(this, R.raw.style_json));

            if (!success) {
                Log.e(TAG, "Style parsing failed.");
            }
        } catch (Resources.NotFoundException e) {
            Log.e(TAG, "Can't find style. Error: ", e);
        }
        map.moveCamera(CameraUpdateFactory.newLatLngZoom(coordinates, 15f));
        marker = map.addMarker(new MarkerOptions().position(coordinates));
    }

    private void fillInAddress(Place place) {
        AddressComponents components = place.getAddressComponents();
        StringBuilder address1 = new StringBuilder();
        StringBuilder postcode = new StringBuilder();

        // Get each component of the address from the place details,
        // and then fill-in the corresponding field on the form.
        // Possible AddressComponent types are documented at https://goo.gle/32SJPM1
        if (components != null) {
            for (AddressComponent component : components.asList()) {
                String type = component.getTypes().get(0);
                switch (type) {
                    case "street_number": {
                        address1.insert(0, component.getName());
                        break;
                    }

                    case "route": {
                        address1.append(" ");
                        address1.append(component.getShortName());
                        break;
                    }

                    case "postal_code": {
                        postcode.insert(0, component.getName());
                        break;
                    }

                    case "postal_code_suffix": {
                        postcode.append("-").append(component.getName());
                        break;
                    }

                    case "locality":
                        binding.autocompleteCity.setText(component.getName());
                        break;

                    case "administrative_area_level_1": {
                        binding.autocompleteState.setText(component.getShortName());
                        break;
                    }

                    case "country":
                        binding.autocompleteCountry.setText(component.getName());
                        break;
                }
            }
        }

        binding.autocompleteAddress1.setText(address1.toString());
        binding.autocompletePostal.setText(postcode.toString());

        // After filling the form with address components from the Autocomplete
        // prediction, set cursor focus on the second address line to encourage
        // entry of sub-premise information such as apartment, unit, or floor number.
        binding.autocompleteAddress2.requestFocus();

        // Add a map for visual confirmation of the address
        showMap(place);
    }

    private void showMap(Place place) {
        coordinates = place.getLatLng();

        // It isn't possible to set a fragment's id programmatically so we set a tag instead and
        // search for it using that.
        mapFragment = (SupportMapFragment)
                getSupportFragmentManager().findFragmentByTag(MAP_FRAGMENT_TAG);

        // We only create a fragment if it doesn't already exist.
        if (mapFragment == null) {
            mapPanel = ((ViewStub) findViewById(R.id.stub_map)).inflate();
            GoogleMapOptions mapOptions = new GoogleMapOptions();
            mapOptions.mapToolbarEnabled(false);

            // To programmatically add the map, we first create a SupportMapFragment.
            mapFragment = SupportMapFragment.newInstance(mapOptions);

            // Then we add it using a FragmentTransaction.
            getSupportFragmentManager()
                    .beginTransaction()
                    .add(R.id.confirmation_map, mapFragment, MAP_FRAGMENT_TAG)
                    .commit();
            mapFragment.getMapAsync(this);
        } else {
            updateMap(coordinates);
        }
    }

    private void updateMap(LatLng latLng) {
        marker.setPosition(latLng);
        map.moveCamera(CameraUpdateFactory.newLatLngZoom(latLng, 15f));
        if (mapPanel.getVisibility() == View.GONE) {
            mapPanel.setVisibility(View.VISIBLE);
        }
    }

    private void saveForm() {
        Log.d(TAG, "checkProximity = " + checkProximity);
        if (checkProximity) {
            checkLocationPermissions();
        } else {
            Toast.makeText(
                            this,
                            R.string.autocomplete_skipped_message,
                            Toast.LENGTH_SHORT)
                    .show();
        }
    }

    private void clearForm() {
        binding.autocompleteAddress1.setText("");
        binding.autocompleteAddress2.getText().clear();
        binding.autocompleteCity.getText().clear();
        binding.autocompleteState.getText().clear();
        binding.autocompletePostal.getText().clear();
        binding.autocompleteCountry.getText().clear();
        if (mapPanel != null) {
            mapPanel.setVisibility(View.GONE);
        }
        binding.autocompleteAddress1.requestFocus();
    }

    // Register the permissions callback, which handles the user's response to the
    // system permissions dialog. Save the return value, an instance of
    // ActivityResultLauncher, as an instance variable.
    private final ActivityResultLauncher<String> requestPermissionLauncher =
            registerForActivityResult(new ActivityResultContracts.RequestPermission(), isGranted -> {
                if (isGranted) {
                    // Since ACCESS_FINE_LOCATION is the only permission in this sample,
                    // run the location comparison task once permission is granted.
                    // Otherwise, check which permission is granted.
                    getAndCompareLocations();
                } else {
                    // Fallback behavior if user denies permission
                    Log.d(TAG, "User denied permission");
                }
            });

    private void checkLocationPermissions() {
        if (ContextCompat.checkSelfPermission(this, ACCESS_FINE_LOCATION)
                == PackageManager.PERMISSION_GRANTED) {
            getAndCompareLocations();
        } else {
            requestPermissionLauncher.launch(
                    ACCESS_FINE_LOCATION);
        }
    }

    @SuppressLint("MissingPermission")
    private void getAndCompareLocations() {
        // TODO: Detect and handle if user has entered or modified the address manually and update
        // the coordinates variable to the Lat/Lng of the manually entered address. May use
        // Geocoding API to convert the manually entered address to a Lat/Lng.
        LatLng enteredLocation = coordinates;
        map.setMyLocationEnabled(true);

        FusedLocationProviderClient fusedLocationClient =
                LocationServices.getFusedLocationProviderClient(this);

        fusedLocationClient.getLastLocation()
                .addOnSuccessListener(this, location -> {
                    // Got last known location. In some rare situations this can be null.
                    if (location == null) {
                        return;
                    }

                    deviceLocation = new LatLng(location.getLatitude(), location.getLongitude());
                    Log.d(TAG, "device location = " + deviceLocation);
                    Log.d(TAG, "entered location = " + enteredLocation.toString());

                    // Use the computeDistanceBetween function in the Maps SDK for Android Utility Library
                    // to use spherical geometry to compute the distance between two Lat/Lng points.
                    double distanceInMeters = computeDistanceBetween(deviceLocation, enteredLocation);
                    if (distanceInMeters <= acceptedProximity) {
                        Log.d(TAG, "location matched");
                        // TODO: Display UI based on the locations matching
                    } else {
                        Log.d(TAG, "location not matched");
                        // TODO: Display UI based on the locations not matching
                    }
                });
    }
}
    

एपीआई चालू करना

इन सुझावों को लागू करने के लिए, आपको Google Cloud Console में ये एपीआई चालू करने होंगे:

• Android के लिए Maps SDK (या अपनी पसंद के प्लैटफ़ॉर्म के लिए एपीआई)
• Places API

सेटअप के बारे में ज़्यादा जानकारी के लिए, Google Cloud प्रोजेक्ट सेट अप करना लेख पढ़ें.

इनपुट फ़ील्ड में ऑटोकंप्लीट की सुविधा जोड़ना

इस सेक्शन में, पते वाले फ़ॉर्म में जगह के नाम के लिए ऑटोकंप्लीट की सुविधा जोड़ने का तरीका बताया गया है.

जगह के नाम के शुरुआती अक्षर लिखने पर पूरा नाम सुझाने वाला विजेट जोड़ना

Android में, ऑटोकंप्लीट इंटेंट का इस्तेमाल करके, ऑटोकंप्लीट विजेट जोड़ा जा सकता है. यह विजेट, पते की पहली लाइन वाले इनपुट फ़ील्ड से Place Autocomplete की सुविधा लॉन्च करता है. इस फ़ील्ड में उपयोगकर्ता अपना पता डालना शुरू करेगा. टाइप करना शुरू करने पर, उन्हें अपने-आप पूरा होने वाली सूची में से अपना पता चुनने का विकल्प मिलेगा.

सबसे पहले, ActivityResultLauncher का इस्तेमाल करके, गतिविधि लॉन्च करने वाला एक ऑब्जेक्ट तैयार करें. यह ऑब्जेक्ट, लॉन्च की गई गतिविधि से नतीजे का इंतज़ार करेगा. नतीजे के कॉलबैक में, Place ऑब्जेक्ट होगा. यह ऑब्जेक्ट, उस पते से जुड़ा होगा जिसे उपयोगकर्ता ने अपने-आप पूरे होने वाले सुझावों में से चुना है.

    private final ActivityResultLauncher<Intent> startAutocomplete = registerForActivityResult(
            new ActivityResultContracts.StartActivityForResult(),
            result -> {
                if (result.getResultCode() == Activity.RESULT_OK) {
                    Intent intent = result.getData();
                    if (intent != null) {
                        Place place = Autocomplete.getPlaceFromIntent(intent);

                        // Write a method to read the address components from the Place
                        // and populate the form with the address components
                        Log.d(TAG, "Place: " + place.getAddressComponents());
                        fillInAddress(place);
                    }
                } else if (result.getResultCode() == Activity.RESULT_CANCELED) {
                    // The user canceled the operation.
                    Log.i(TAG, "User canceled autocomplete");
                }
            });

इसके बाद, जगह की जानकारी अपने-आप भरने वाले इंटेंट के फ़ील्ड, जगह, और टाइप प्रॉपर्टी तय करें. साथ ही, इसे Autocomplete.IntentBuilder की मदद से बनाएं. आखिर में, पिछले कोड सैंपल में ActivityResultLauncher का इस्तेमाल करके इंटेंट लॉन्च करें.

    private void startAutocompleteIntent() {

        // Set the fields to specify which types of place data to
        // return after the user has made a selection.
        List<Place.Field> fields = Arrays.asList(Place.Field.ADDRESS_COMPONENTS,
                Place.Field.LAT_LNG, Place.Field.VIEWPORT);

        // Build the autocomplete intent with field, country, and type filters applied
        Intent intent = new Autocomplete.IntentBuilder(AutocompleteActivityMode.OVERLAY, fields)
                .setCountries(Arrays.asList("US"))
                .setTypesFilter(new ArrayList<String>() {{
                    add(TypeFilter.ADDRESS.toString().toLowerCase());
                }})
                .build(this);
        startAutocomplete.launch(intent);
    }

जगह के नाम के अपने-आप पूरा होने की सुविधा से मिले पते को मैनेज करना

ActivityResultLauncher को पहले से तय करने पर, यह भी तय हो जाता है कि कॉलबैक में गतिविधि का नतीजा मिलने पर क्या करना है. अगर उपयोगकर्ता ने किसी अनुमान को चुना है, तो उसे नतीजे के ऑब्जेक्ट में मौजूद इंटेंट में डिलीवर किया जाएगा. इंटेंट को Autocomplete.IntentBuilder ने बनाया है. इसलिए, Autocomplete.getPlaceFromIntent() वाला तरीका इससे Place ऑब्जेक्ट को निकाल सकता है.

    private final ActivityResultLauncher<Intent> startAutocomplete = registerForActivityResult(
            new ActivityResultContracts.StartActivityForResult(),
            result -> {
                if (result.getResultCode() == Activity.RESULT_OK) {
                    Intent intent = result.getData();
                    if (intent != null) {
                        Place place = Autocomplete.getPlaceFromIntent(intent);

                        // Write a method to read the address components from the Place
                        // and populate the form with the address components
                        Log.d(TAG, "Place: " + place.getAddressComponents());
                        fillInAddress(place);
                    }
                } else if (result.getResultCode() == Activity.RESULT_CANCELED) {
                    // The user canceled the operation.
                    Log.i(TAG, "User canceled autocomplete");
                }
            });

इसके बाद, Place.getAddressComponents() को कॉल करें और पते के हर कॉम्पोनेंट को पते के फ़ॉर्म में मौजूद उसके इनपुट फ़ील्ड से मैच करें. साथ ही, फ़ील्ड में उपयोगकर्ता की चुनी गई जगह की वैल्यू डालें.

इस पेज के कोड पाएं सेक्शन में दिए गए सैंपल कोड के fillInAddress तरीके में, पते के फ़ॉर्म फ़ील्ड भरने के लिए लागू करने का एक उदाहरण शेयर किया गया है.

मैन्युअल तरीके से पता डालने के बजाय, अनुमानित पते का डेटा कैप्चर करने से, पते के सटीक होने की पुष्टि करने में मदद मिलती है. साथ ही, यह पक्का किया जा सकता है कि पता सही हो और उस पर डिलीवरी की जा सकती हो. इससे उपयोगकर्ता को कम कीस्ट्रोक करने पड़ते हैं.

जगह के नाम अपने-आप भरने की सुविधा लागू करते समय ध्यान रखने वाली बातें

जगह के नाम अपने-आप भरने की सुविधा में कई विकल्प होते हैं. इनकी मदद से, इस सुविधा को अपनी ज़रूरत के हिसाब से लागू किया जा सकता है. ऐसा तब करें, जब आपको सिर्फ़ विजेट का इस्तेमाल नहीं करना हो. जगह की जानकारी को सही तरीके से मैच करने के लिए, एक साथ कई सेवाओं का इस्तेमाल किया जा सकता है.

• ADDRESS फ़ॉर्म के लिए, types पैरामीटर को address पर सेट करें, ताकि मिलान को सिर्फ़ पूरे पते तक सीमित किया जा सके. जगह की जानकारी अपने-आप भरने के अनुरोधों में इस्तेमाल किए जा सकने वाले टाइप के बारे में ज़्यादा जानें.

• अगर आपको दुनिया भर में खोज नहीं करनी है, तो पाबंदियां और पूर्वाग्रह सेट करें. ऐसे कई पैरामीटर हैं जिनका इस्तेमाल करके, किसी मैच को सिर्फ़ चुनिंदा क्षेत्रों के लिए पक्षपाती या प्रतिबंधित किया जा सकता है.

  • किसी क्षेत्र के लिए आयताकार सीमाएं सेट करने के लिए, RectangularBounds का इस्तेमाल करें. यह पक्का करने के लिए कि सिर्फ़ उन क्षेत्रों के पते दिखाए जाएं, setLocationRestriction() का इस्तेमाल करें.

  • setCountries() का इस्तेमाल करके, जवाबों को कुछ देशों तक सीमित करें.

• फ़ील्ड में बदलाव करने की सुविधा चालू रखें, ताकि अगर कुछ फ़ील्ड मैच नहीं होते हैं, तो उनमें बदलाव किया जा सके. साथ ही, ग्राहकों को पता अपडेट करने की अनुमति दें. Place Autocomplete से मिले ज़्यादातर पतों में, अपार्टमेंट, सुइट या यूनिट नंबर जैसे सबप्रीमाइज़ नंबर नहीं होते. इसलिए, अगर ज़रूरी हो, तो उपयोगकर्ता को यह जानकारी भरने के लिए कहा जा सकता है. इसके लिए, फ़ोकस को पता पंक्ति 2 पर ले जाएं.

पते की पुष्टि करने के लिए विज़ुअल सबूत देना

पते की जानकारी डालने के दौरान, उपयोगकर्ताओं को मैप पर पते की पुष्टि करने के लिए विज़ुअल जानकारी दें. इससे लोगों को यह भरोसा मिलता है कि पता सही है.

यहां दिए गए डायग्राम में, पते के नीचे एक मैप दिखाया गया है. इसमें, डाले गए पते पर एक पिन दिख रही है.

यहां दिए गए उदाहरण में, Android में मैप जोड़ने का बुनियादी तरीका बताया गया है. ज़्यादा जानकारी के लिए, दस्तावेज़ देखें.

• SupportMapFragment जोड़ना (इस मामले में, फ़्रैगमेंट को डाइनैमिक तरीके से जोड़ना)
• फ़्रैगमेंट का हैंडल पाना और कॉलबैक रजिस्टर करना
• मैप में मार्कर जोड़ना और उसे स्टाइल करना
• मैप कंट्रोल बंद करना

SupportMapFragment को जोड़ा जा रहा है

सबसे पहले, लेआउट एक्सएमएल फ़ाइल में SupportMapFragment फ़्रैगमेंट जोड़ें.

    <fragment
        android:name="com.google.android.gms.maps.SupportMapFragment"
        android:id="@+id/confirmation_map"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

इसके बाद, अगर फ़्रैगमेंट मौजूद नहीं है, तो उसे प्रोग्राम के हिसाब से जोड़ें.

    private void showMap(Place place) {
        coordinates = place.getLatLng();

        // It isn't possible to set a fragment's id programmatically so we set a tag instead and
        // search for it using that.
        mapFragment = (SupportMapFragment)
                getSupportFragmentManager().findFragmentByTag(MAP_FRAGMENT_TAG);

        // We only create a fragment if it doesn't already exist.
        if (mapFragment == null) {
            mapPanel = ((ViewStub) findViewById(R.id.stub_map)).inflate();
            GoogleMapOptions mapOptions = new GoogleMapOptions();
            mapOptions.mapToolbarEnabled(false);

            // To programmatically add the map, we first create a SupportMapFragment.
            mapFragment = SupportMapFragment.newInstance(mapOptions);

            // Then we add it using a FragmentTransaction.
            getSupportFragmentManager()
                    .beginTransaction()
                    .add(R.id.confirmation_map, mapFragment, MAP_FRAGMENT_TAG)
                    .commit();
            mapFragment.getMapAsync(this);
        } else {
            updateMap(coordinates);
        }
    }

फ़्रैगमेंट का हैंडल पाना और कॉलबैक रजिस्टर करना

1. फ़्रैगमेंट का हैंडल पाने के लिए, FragmentManager.findFragmentById तरीके को कॉल करें और उसे अपनी लेआउट फ़ाइल में फ़्रैगमेंट का संसाधन आईडी पास करें. अगर आपने फ़्रैगमेंट को डाइनैमिक तरीके से जोड़ा है, तो इस चरण को छोड़ दें, क्योंकि आपने हैंडल पहले ही वापस पा लिया है.

2. फ़्रैगमेंट पर कॉलबैक सेट करने के लिए, getMapAsync तरीके को कॉल करें.

उदाहरण के लिए, अगर आपने फ़्रैगमेंट को स्टैटिक तौर पर जोड़ा है, तो:

Kotlin

val mapFragment = supportFragmentManager
    .findFragmentById(R.id.map) as SupportMapFragment
mapFragment.getMapAsync(this)

      

Java

SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager()
    .findFragmentById(R.id.map);
mapFragment.getMapAsync(this);

      

मैप में स्टाइल जोड़ना और मार्कर जोड़ना

मैप तैयार होने के बाद, स्टाइल सेट करें, कैमरे को बीच में रखें, और डाले गए पते के निर्देशांकों पर मार्कर जोड़ें. नीचे दिए गए कोड में, JSON ऑब्जेक्ट में तय की गई स्टाइलिंग का इस्तेमाल किया गया है. इसके अलावा, क्लाउड पर मैप की स्टाइलिंग की सुविधा के साथ तय किया गया मैप आईडी भी लोड किया जा सकता है.

    @Override
    public void onMapReady(@NonNull GoogleMap googleMap) {
        map = googleMap;
        try {
            // Customise the styling of the base map using a JSON object defined
            // in a string resource.
            boolean success = map.setMapStyle(
                    MapStyleOptions.loadRawResourceStyle(this, R.raw.style_json));

            if (!success) {
                Log.e(TAG, "Style parsing failed.");
            }
        } catch (Resources.NotFoundException e) {
            Log.e(TAG, "Can't find style. Error: ", e);
        }
        map.moveCamera(CameraUpdateFactory.newLatLngZoom(coordinates, 15f));
        marker = map.addMarker(new MarkerOptions().position(coordinates));
    }

(पूरा कोड सैंपल देखें)

मैप कंट्रोल बंद करना

अगर आपको मैप को आसान बनाना है, ताकि उसमें जगह की जानकारी के साथ-साथ मैप के अन्य कंट्रोल (जैसे कि कंपास, टूलबार या अन्य सुविधाएं) न दिखें, तो कंट्रोल को बंद करें. ऐसा करने के लिए, उन कंट्रोल को बंद करें जिनकी आपको ज़रूरत नहीं है. Android पर, सीमित इंटरैक्टिविटी के लिए लाइट मोड चालू किया जा सकता है.