在谷歌地图搜索结果顶部添加自定义标记

在谷歌地图搜索结果顶部添加自定义标记

我不确定这是否是一个有效的问题,但我会尝试。我搜索过这个主题,但只找到了静态地图视图的信息。

我想在搜索特定地址后在谷歌地图上显示自定义标记。

例如,我有一些特定城市中地点的地址。现在我想在谷歌地图中搜索一个新地点。在此搜索结果(带有显示搜索地点的图钉的地图)上,我还想显示其他地点。

我只是想通过查看地图上的结果来验证哪些已知地点靠近新的搜索地点。

我真的想知道这是否有可能实现。也许可以提示我应该搜索什么才能深入了解该主题。到目前为止,我发现的所有内容似乎都不适合我想要的特定用例。

我想象的是一个带有一些 Java 脚本的页面,也许其中嵌入了谷歌地图搜索,并负责从地点数据集中叠加标记。

我可以使用谷歌地图 API 来做这件事吗?

答案1

您正在寻找Google 地图 JavaScript API您可以在其中使用适当的 API。

请按照提供的例子了解更多信息(例如简单标记)。

示例代码:

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Simple markers</title>
    <style>
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
      #map {
        height: 100%;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script>

function initMap() {
  var myLatLng = {lat: -25.363, lng: 131.044};

  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 4,
    center: myLatLng
  });

  var marker = new google.maps.Marker({
    position: myLatLng,
    map: map,
    title: 'Hello World!'
  });
}

    </script>
    <script async defer
        src="https://maps.googleapis.com/maps/api/js?key=API_KEY&signed_in=true&callback=initMap"></script>
  </body>
</html>

如果您希望将其添加到搜索结果顶部,请参阅: 地点搜索例子。

相关内容