class MapsMarkerActivity : AppCompatActivity(), OnMapReadyCallback {

      override fun onCreate(savedInstanceState: Bundle?) {
          super.onCreate(savedInstanceState)
          // Retrieve the content view that renders the map.
          setContentView(R.layout.activity_maps)
          if (getString(R.string.maps_api_key).isEmpty()) {
              Toast.makeText(this, "Add your own API key in MapWithMarker/app/secure.properties as MAPS_API_KEY=YOUR_API_KEY", Toast.LENGTH_LONG).show()
          }

          // Get the SupportMapFragment and request notification when the map is ready to be used.
          val mapFragment = supportFragmentManager.findFragmentById(R.id.map) as? SupportMapFragment
          mapFragment?.getMapAsync(this)
      }

      override fun onMapReady(googleMap: GoogleMap?) {
          googleMap?.apply {
              val sydney = LatLng(-33.852, 151.211)
              addMarker(
                  MarkerOptions()
                      .position(sydney)
                      .title("Marker in Sydney")
              )
              moveCamera(CameraUpdateFactory.newLatLng(sydney))
          }
      }
  }
                       

  public class MapsMarkerActivity extends AppCompatActivity
          implements OnMapReadyCallback {

      @Override
      protected void onCreate(Bundle savedInstanceState) {
          super.onCreate(savedInstanceState);
          // Retrieve the content view that renders the map.
          setContentView(R.layout.activity_maps);
          // Get the SupportMapFragment and request notification
          // when the map is ready to be used.
          SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager()
                  .findFragmentById(R.id.map);
          mapFragment.getMapAsync(this);
      }

      @Override
      public void onMapReady(GoogleMap googleMap) {
          // Add a marker in Sydney, Australia,
          // and move the map's camera to the same location.
          LatLng sydney = new LatLng(-33.852, 151.211);
          googleMap.addMarker(new MarkerOptions()
              .position(sydney)
              .title("Marker in Sydney"));
          googleMap.moveCamera(CameraUpdateFactory.newLatLng(sydney));
      }
  }
                       

  class ViewController: UIViewController {
      override func viewDidLoad() {
          super.viewDidLoad()
          // Create a GMSCameraPosition that tells the map to display the
          // coordinate -33.86,151.20 at zoom level 6.
          let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 6.0)
          let mapView = GMSMapView.map(withFrame: self.view.frame, camera: camera)
          self.view.addSubview(mapView)

          // Creates a marker in the center of the map.
          let marker = GMSMarker()
          marker.position = CLLocationCoordinate2D(latitude: -33.86, longitude: 151.20)
          marker.title = "Sydney"
          marker.snippet = "Australia"
          marker.map = mapView
    }
  }
                       

  @implementation ViewController

  - (void)viewDidLoad {
      [super viewDidLoad];
    // Create a GMSCameraPosition that tells the map to display the
    // coordinate -33.86,151.20 at zoom level 6.
    GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86
                                                            longitude:151.20
                                                                 zoom:6];
    GMSMapView *mapView = [GMSMapView mapWithFrame:self.view.frame camera:camera];
    mapView.myLocationEnabled = YES;
    [self.view addSubview:mapView];

    // Creates a marker in the center of the map.
    GMSMarker *marker = [[GMSMarker alloc] init];
    marker.position = CLLocationCoordinate2DMake(-33.86, 151.20);
    marker.title = @"Sydney";
    marker.snippet = @"Australia";
    marker.map = mapView;
  }

  @end
                       

  let autocomplete: google.maps.places.Autocomplete;

  const componentForm = {
    street_number: "short_name",
    route: "long_name",
    locality: "long_name",
    administrative_area_level_1: "short_name",
    country: "long_name",
    postal_code: "short_name",
  };

  function initAutocomplete() {
    // Create the autocomplete object, restricting the search predictions to
    // geographical location types.
    autocomplete = new google.maps.places.Autocomplete(
      document.getElementById("autocomplete") as HTMLInputElement,
      { types: ["geocode"] }
    );

    // When the user selects an address from the drop-down, populate the
    // address fields in the form.
    autocomplete.addListener("place_changed", fillInAddress);
  }

  function fillInAddress() {
    // Get the place details from the autocomplete object.
    const place = autocomplete.getPlace();

    for (const component in componentForm) {
      (document.getElementById(component) as HTMLInputElement).value = "";
      (document.getElementById(component) as HTMLInputElement).disabled = false;
    }

    // Get each component of the address from the place details,
    // and then fill-in the corresponding field on the form.
    for (const component of place.address_components as google.maps.GeocoderAddressComponent[]) {
      const addressType = component.types[0];

      if (componentForm[addressType]) {
        const val = component[componentForm[addressType]];
        (document.getElementById(addressType) as HTMLInputElement).value = val;
      }
    }
  }
                       

  <!DOCTYPE html>
  <html>
    <head>
      <title>Place Autocomplete Address Form</title>
      <script
        src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initAutocomplete&libraries=places&v=weekly"
        defer
      ></script>
      <link rel="stylesheet" type="text/css" href="./style.css" />
      <script src="./index.js"></script>
    </head>
    <body>
      <div id="locationField">
        <input
          id="autocomplete"
          placeholder="Enter your address"
          type="text"
        />
      </div>

      <table id="address">
        <tr>
          <td class="label">Street address</td>
          <td class="slimField">
            <input class="field" id="street_number" disabled="true" />
          </td>
          <td class="wideField" colspan="2">
            <input class="field" id="route" disabled="true" />
          </td>
        </tr>
        <tr>
          <td class="label">City</td>
          <td class="wideField" colspan="3">
            <input class="field" id="locality" disabled="true" />
          </td>
        </tr>
        <tr>
          <td class="label">State</td>
          <td class="slimField">
            <input
              class="field"
              id="administrative_area_level_1"
              disabled="true"
            />
          </td>
          <td class="label">Zip code</td>
          <td class="wideField">
            <input class="field" id="postal_code" disabled="true" />
          </td>
        </tr>
        <tr>
          <td class="label">Country</td>
          <td class="wideField" colspan="3">
            <input class="field" id="country" disabled="true" />
          </td>
        </tr>
      </table>
    </body>
  </html>
                       

  /* Always set the map height explicitly to define the size of the div
         * element that contains the map. */
  #map {
    height: 100%;
  }

  /* Optional: Makes the sample page fill the window. */
  html,
  body {
    height: 100%;
    margin: 0;
    padding: 0;
  }

  #locationField,
  #controls {
    position: relative;
    width: 480px;
  }

  #autocomplete {
    position: absolute;
    top: 0;
    left: 0;
    width: 99%;
  }

  .label {
    text-align: right;
    font-weight: bold;
    width: 100px;
    color: #303030;
    font-family: "Roboto", Arial, Helvetica, sans-serif;
  }

  #address {
    border: 1px solid #000090;
    background-color: #f0f9ff;
    width: 480px;
    padding-right: 2px;
  }

  #address td {
    font-size: 10pt;
  }

  .field {
    width: 99%;
  }

  .slimField {
    width: 80px;
  }

  .wideField {
    width: 200px;
  }

  #locationField {
    height: 20px;
    margin-bottom: 2px;
  }
                       

  // Use fields to define the data types to return.
  val placeFields: List<Place.Field> = listOf(Place.Field.NAME)

  // Use the builder to create a FindCurrentPlaceRequest.
  val request: FindCurrentPlaceRequest = FindCurrentPlaceRequest.newInstance(placeFields)

  // Call findCurrentPlace and handle the response (first check that the user has granted permission).
  if (ContextCompat.checkSelfPermission(this, permission.ACCESS_FINE_LOCATION) ==
      PackageManager.PERMISSION_GRANTED) {

      val placeResponse = placesClient.findCurrentPlace(request)
      placeResponse.addOnCompleteListener { task ->
          if (task.isSuccessful) {
              val response = task.result
              for (placeLikelihood: PlaceLikelihood in response?.placeLikelihoods ?: emptyList()) {
                  Log.i(
                      TAG,
                      "Place '${placeLikelihood.place.name}' has likelihood: ${placeLikelihood.likelihood}"
                  )
              }
          } else {
              val exception = task.exception
              if (exception is ApiException) {
                  Log.e(TAG, "Place not found: ${exception.statusCode}")
              }
          }
      }
  }
                       

  // Use fields to define the data types to return.
  List<Place.Field> placeFields = Collections.singletonList(Place.Field.NAME);

  // Use the builder to create a FindCurrentPlaceRequest.
  FindCurrentPlaceRequest request = FindCurrentPlaceRequest.newInstance(placeFields);

  // Call findCurrentPlace and handle the response (first check that the user has granted permission).
  if (ContextCompat.checkSelfPermission(this, ACCESS_FINE_LOCATION) == PackageManager.PERMISSION_GRANTED) {
      Task<FindCurrentPlaceResponse> placeResponse = placesClient.findCurrentPlace(request);
      placeResponse.addOnCompleteListener(task -> {
          if (task.isSuccessful()){
              FindCurrentPlaceResponse response = task.getResult();
              for (PlaceLikelihood placeLikelihood : response.getPlaceLikelihoods()) {
                  Log.i(TAG, String.format("Place '%s' has likelihood: %f",
                      placeLikelihood.getPlace().getName(),
                      placeLikelihood.getLikelihood()));
              }
          } else {
              Exception exception = task.getException();
              if (exception instanceof ApiException) {
                  ApiException apiException = (ApiException) exception;
                  Log.e(TAG, "Place not found: " + apiException.getStatusCode());
              }
          }
      });
  }
                       

  function initMap(): void {
    const directionsRenderer = new google.maps.DirectionsRenderer();
    const directionsService = new google.maps.DirectionsService();
    const map = new google.maps.Map(
      document.getElementById("map") as HTMLElement,
      {
        zoom: 14,
        center: { lat: 37.77, lng: -122.447 },
      }
    );
    directionsRenderer.setMap(map);

    calculateAndDisplayRoute(directionsService, directionsRenderer);
    (document.getElementById("mode") as HTMLInputElement).addEventListener(
      "change",
      () => {
        calculateAndDisplayRoute(directionsService, directionsRenderer);
      }
    );
  }

  function calculateAndDisplayRoute(
    directionsService: google.maps.DirectionsService,
    directionsRenderer: google.maps.DirectionsRenderer
  ) {
    directionsService.route(
      {
        origin: { lat: 37.77, lng: -122.447 }, // Haight.
        destination: { lat: 37.768, lng: -122.511 }, // Ocean Beach.
        travelMode: google.maps.TravelMode['DRIVING'],
      },
      (response, status) => {
        if (status == "OK") {
          directionsRenderer.setDirections(response);
        } else {
          window.alert("Directions request failed due to " + status);
        }
      }
    );
  }
                       

  <!DOCTYPE html>
  <html>
    <head>
      <title>Travel Modes in Directions</title>
      <script
        src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap&libraries=&v=weekly"
        defer
      ></script>
      <link rel="stylesheet" type="text/css" href="./style.css" />
      <script src="./index.js"></script>
    </head>
    <body>
      <div id="map"></div>
    </body>
  </html>
                       

  /* Always set the map height explicitly to define the size of the div
         * element that contains the map. */
  #map {
    height: 100%;
  }

  /* Optional: Makes the sample page fill the window. */
  html,
  body {
    height: 100%;
    margin: 0;
    padding: 0;
  }