缩放更改时的缩放标记答案

【问题标题】：Scaling Markers on Zoom Change缩放更改时的缩放标记
【发布时间】：2012-08-14 08:39:32
【问题描述】：

对于圣诞市场，我目前正在制作 Google Maps 地图。我加载了代表不同大小的市场摊位的不同图标的精灵：

（灰色版本为停用状态）：
http://www.felixkittler.de/area51/googlemaps/buden.html

到目前为止，一切正常，只要用户不放大或缩小 - 如果是这样，展位不会缩放，因此看起来太大或太小。

我想我可能会预定义另一组图标，包含相同的标记，但带有缩放的标记图像。不幸的是，我无法让它工作：

for(i=0; i<markerSizes.length; i++){
    var aktiv = new google.maps.MarkerImage(
        "http://www.felixkittler.de/area51/googlemaps/buden/SPRITE.png", 
        new google.maps.Size(markerSizes[i], 27, "px", "px"),
        new google.maps.Point(85, i*30),
        new google.maps.Point(0, 0),
        new google.maps.Size(markerSizes[i]*2, 14) //this doesn't work!!!
    );
    gicons_aktiv.push(aktiv);
}

我还没有跟踪 zoom_changed 事件，但我设置了一个应该使用缩放图标的文件版本：
http://www.felixkittler.de/area51/googlemaps/buden_scaled.html （在第 116 和 125 行放大 (x2)）。

任何想法如何解决这个问题？由于这不是我使用的唯一精灵，我想避免上传同一个精灵的多个分辨率，放大或缩小会更方便。

谢谢！！！

【问题讨论】：

可能是无用的信息，但似乎自定义添加的精灵不会根据地图按比例改变大小。我也解决了这种情况。

标签： javascript google-maps google-maps-markers scaling

【解决方案1】：

所以，我只是自己发现的。
感谢 Marc Ridey this blog post！

原始尺寸的标记图像：

var original = new google.maps.MarkerImage(
    "http://www.path/to/sprite.png", 
    new google.maps.Size(markerSizes[i], 24), //marker height=24, width in array
    new google.maps.Point(0, i*30), // each row of the sprite grid is 30px tall
    new google.maps.Point(0, 0),
    null // use file dimensions 168 x 270px
);

用于显示标记缩小 50% 的标记图像：

var half = new google.maps.MarkerImage(
    "http://www.path/to/sprite.png", 
    new google.maps.Size(markerSizes[i]/2, 12),
    new google.maps.Point(0, i*15),
    new google.maps.Point(0, 0),
    new google.maps.Size(84, 135) // original dimension of sprite: 168 x 270 px
);

希望这对任何人都有帮助（：

【讨论】：