如何在Google Maps API上定位自定义按钮控件？

在Google Maps API上定位自定义按钮控件可以通过以下步骤实现：

创建一个HTML页面，并引入Google Maps API的JavaScript库。

<!DOCTYPE html>
<html>
<head>
  <title>Custom Button Control</title>
  <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async defer></script>
  <style>
    #map {
      height: 400px;
      width: 100%;
    }
    .custom-button {
      background-color: #4285F4;
      color: #fff;
      padding: 10px;
      border-radius: 5px;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <div id="map"></div>
</body>
</html>

在页面中创建一个地图容器，并设置其高度和宽度。

<div id="map"></div>

在JavaScript部分，初始化地图并添加自定义按钮控件。

<script>
  function initMap() {
    // 创建地图对象
    var map = new google.maps.Map(document.getElementById('map'), {
      center: {lat: 37.7749, lng: -122.4194}, // 设置地图中心点坐标
      zoom: 12 // 设置地图缩放级别
    });

    // 创建自定义按钮控件
    var customButtonDiv = document.createElement('div');
    var customButton = new CustomButton(customButtonDiv, map);

    // 将自定义按钮控件添加到地图上
    map.controls[google.maps.ControlPosition.TOP_RIGHT].push(customButtonDiv);
  }

  // 自定义按钮控件类
  function CustomButton(controlDiv, map) {
    // 创建按钮元素
    var button = document.createElement('button');
    button.innerHTML = 'Custom Button';
    button.className = 'custom-button';

    // 按钮点击事件处理函数
    button.addEventListener('click', function() {
      // 在按钮被点击时执行的操作
      alert('Custom button clicked!');
    });

    // 将按钮元素添加到控件容器中
    controlDiv.appendChild(button);
  }
</script>