Google地图：标记边界 [英] Google Maps: Border on Markers

问题描述

我试图在Google地图上将照片显示为标记。通过将标记重新定义为图像，这没有问题，但是我想放置某种边框或阴影以使它们更好地突出。像谷歌的照片是最好的，但我想这太复杂了，如果可能的话。一个简单的1px固体边界将会很好。一种选择是实际改变图像，但这不是一种选择。此外，图像大小不同，因此我无法将黑色图像作为阴影（比原始图像大1px）。

以下是这个想法：

CURRENT：

寻找：

偶冷却器：

理想世界：

这可能吗？

解决方案

查看Rich Marker v3库 demo （ 实际图书馆 a> ），它允许使用自定义html作为标记。

设置标记 $ b < img
src =http://www.picturesofengland.com/img/S/ 1015720.jpg
style =border：2px纯白色;
-moz-box-shadow：0px 0px 10px＃000;
-webkit-box-shadow：0px 0px 10px＃000;
box-shadow：0px 0px 10px＃000;
/>


然后点击切换平面（库api中的一个选项）就可以做你想做的事情了。你改变图像src当然;）

查看更多图书馆 http://code.google.com/p/google-maps-utility-library-v3/wiki/Libraries

I'm trying to display photos as markers on Google Maps. This is no problem by redefining the marker as an image, but I want to put some sort of border or shadow to make them stand out better. Something like the Google photos would be best, but I guess this is too complicated, if at all possible. A simple 1px solid border would do fine. One option is to actually change the image, but this is not an option. Also, the images are different sizes so I can not put a black image as the shadow (1px larger than the original).

Here is the idea:

CURRENT:

LOOKING FOR:

EVEN COOLER:

IDEAL WORLD:

Is this possible?

解决方案

Have a look at the Rich Marker v3 library demo (the actual library) which allows to use custom html as a marker.

Setting a marker html of

<img 
  src="http://www.picturesofengland.com/img/S/1015720.jpg" 
  style="border:2px solid white;
  -moz-box-shadow:0px 0px 10px #000;
  -webkit-box-shadow:0px 0px 10px #000;
  box-shadow:0px 0px 10px #000;" 
/>

and clicking the toggle flat (an option in the library api) would do what you want.. you alter the image src of course ;)

for more libraries look at http://code.google.com/p/google-maps-utility-library-v3/wiki/Libraries

这篇关于Google地图：标记边界的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！