谷歌地图搜索标记图标样式

时间:2016-11-15 10:13:50

标签: javascript google-maps google-maps-api-3

当我搜索谷歌地图时,我正在获取带有圆形红色背景的地方标记图标,如下面的屏幕截图所示。我正在尝试在我的应用程序中创建具有完全相同样式的标记。我正在使用谷歌地图API for javascript v3。

以下是根据地点api结果创建Google地图标记的代码。

        var marker = new google.maps.Marker({
          map: $this.map,
          position: place.geometry.location,
          icon: {
              url: place.icon,
              size: new google.maps.Size(18,18),
              origin: new google.maps.Point(0, 0),
              anchor: new google.maps.Point(17, 34),
              scaledSize: new google.maps.Size(18, 18),

            }

        });

enter image description here

google map

中的实例

1 个答案:

答案 0 :(得分:1)

从谷歌地图的文档,
您可以使用网址指定带标记的标记图标。

https://developers.google.com/maps/documentation/javascript/custom-markers

var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
var icons = {
  parking: {
    icon: iconBase + 'parking_lot_maps.png'
  },
  library: {
    icon: iconBase + 'library_maps.png'
  },
  info: {
    icon: iconBase + 'info-i_maps.png'
  }
};

function addMarker(feature) {
  var marker = new google.maps.Marker({
    position: feature.position,
    icon: icons[feature.type].icon,
    map: map
  });
}