如何设置谷歌地图标记大小动态

Question

我通过放大试图大小我的标志，但它似乎没有在这里工作是为了更好地概述代码：

function Icon(url) { 
    this.url = url; 
    this.scaledSize = new google.maps.Size(30, 30); // scaled size 
    //this.origin = new google.maps.Point(0,0); // origin 
    //this.anchor = new google.maps.Point(0, 0); // anchor 
} 

var icon1 = new Icon('img/marker-test.png'); 

     map.addListener('zoom_changed', function() { 
     if(map.zoom === 18){ 
      //marker.setIcon(test); 
      console.log('check'); 
      marker.scaledSize = new google.maps.Size(300, 300); 

     } else { 
      //marker.setIcon(icon1); 
     } 
    }); 

有人知道如何解决这一问题？

Answer 1

我回答之前，一对夫妇建议：

• 您已经使用map.zoom === 18这是无效的。应该是map.getZoom() === 18

• marker.scaledSize无效，因为scaledSize是Icon对象的财产。 Ref：Icon Object Specification

  如果您需要动态设置标记大小，您需要通过图标属性指定标记图像（创建标记时），而不是字符串或保留为空（以显示默认标记）。

规模将不会工作在默认标记。所以你需要为标记提供你自己的自定义图像。

量表VS尺寸

尺度变换标记图像和大小指定的图像的帆布尺寸。设置小标记图像的大小属性不会显示标记图像的任何缩放效果。但是，如果标记图像足够大，并且之前已经用缩小比例绘制，则放大效果会很好。

如果您只缩放图像而不设置大小，标记图像将放大预先指定的大小。这是标记图像的某些部分将不可见。

用简单的话来说，这里是一个fiddle。尝试将缩放比例更改为18以上，然后回到15以下。

Answer 2

尝试使用正确的getZoom映射方法。

if (map.getZoom() === 18) { 
    ... 
} 

https://developers.google.com/maps/documentation/javascript/reference#Map