Google Maps Javascript V3：如何设置标记阴影与标记的偏移量？

Question

我有一个带有几种不同类型图标的 Google 地图。我在每个图标上都有一个阴影。如何调整标记阴影与标记的偏移量？

在构建每个标记的循环中，我有：

var icon = customIcons[type];
var marker = new google.maps.Marker({
    map: map,
    position: point,
    icon: icon.icon,
    shadow: icon.shadow
    });

图标按类型设置。

var customIcons = {
  Football: {
    icon: 'http://path-to-image1.png', 
    shadow: 'http://path-to-shadow-image1.png'
  },
  Lacrosse: {
    icon: 'http://path-to-image2.png',
    shadow: 'http://path-to-shadow-image2.png'
  }
};

在这个tutorial 中，他们将单个图标的大小和偏移设置如下：

var image = new google.maps.MarkerImage('images/beachflag.png',
      // This marker is 20 pixels wide by 32 pixels tall.
      new google.maps.Size(20, 32),
      // The origin for this image is 0,0.
      new google.maps.Point(0,0),
      // The anchor for this image is the base of the flagpole at 0,32.
      new google.maps.Point(0, 32));
  var shadow = new google.maps.MarkerImage('images/beachflag_shadow.png',
      // The shadow image is larger in the horizontal dimension
      // while the position and offset are the same as for the main image.
      new google.maps.Size(37, 32),
      new google.maps.Point(0,0),
      new google.maps.Point(0, 32));

在我的情况下，我有多个图标，它们被设置在一个对象中。如何将大小和偏移量添加到 var customIcons ？

谢谢。

Answer 1

据此Google Map API v3 documentation：

注意：标记阴影在 3.14 版的 Google Maps JavaScript API 中被移除。任何 以编程方式指定的阴影将被忽略。

Answer 2

见：https://developers.google.com/maps/documentation/javascript/reference#MarkerImage

阴影图像是一个 MarkerImage 对象。因此，它的构造函数可以采用anchor 参数（Point 对象）来告诉如何相对于标记坐标定位阴影。

默认情况下，MarkerImage 的底部中心点与标记坐标对齐。如果您的阴影图像与标记图像的大小不同（例如，如果它更宽），则必须调整阴影的位置。