自定义 Google 地图标记 HTML

Question

我嵌入了一个 Google 地图样式的页脚，其中包含一个 div 叠加层，其中包含工作时间或联系信息等信息。我也在尝试合并一个自定义位置标记，如下所示：

谁能帮我解决这个问题？谢谢！

Answer 1

假设您正在使用 google 地图 API，您可以使用此代码。

function initMap() {
  // store latitude and longitude for map and marker
  var myLatLng = {lat: -25.363, lng: 131.044};

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

  // create a custom marker
  var marker = new google.maps.Marker({
    position: myLatLng,
    map: map,
    title: 'Hello World!',
    icon: 'my-image.png'
  });
}

此代码创建了一个存储纬度和经度的 myLatLng 变量，然后创建了一个地图 object。如果您的站点中有地图，我假设您已经进行了该设置。

然后代码声明了一个标记，通过position属性在地图上使用相同的纬度和经度，通过title属性设置标题和通过 icon 属性.

选择将在标记上使用的图像

此功能最初是直接从位于以下位置的文档中提取的：https://developers.google.com/maps/documentation/javascript/markers

自定义 Google 地图标记 HTML

Custom Google Maps marker HTML

html

css

maps

google-maps