对于圣诞市场,我目前正在制作 Google map 。我加载了一个由不同图标组成的 sprite,代表不同大小的市场摊位:
(灰色版本为停用状态):
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))。
有什么办法解决这个问题吗? 由于这不是我使用的唯一 Sprite ,我想避免上传同一个 Sprite 的多个分辨率,放大或缩小会更方便。
谢谢!!!
最佳答案
所以,我自己才发现的。
感谢 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
);
希望这对任何人有帮助(:
关于javascript - 缩放更改时的缩放标记,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11948678/