在 Google 地图上扩展叠加标记？答案

【问题标题】：Expanding Overlay Marker on Google Maps?在 Google 地图上扩展叠加标记？
【发布时间】：2010-07-20 04:14:13
【问题描述】：

我可以很好地在谷歌地图上绘制叠加项目，图像看起来像：

______
|    |
______
  \/

其中“/”部分是在地图上标记纬度/经度的“大头针”和中间的图片。我的问题是，当用户点击它时，有什么方法可以扩展它？我当然必须将其更改为某种对话框或布局，并在单击时进行更改。

我想让它变得更小，就像没有点击时只有一个图像，但是当它被点击时，它会像一秒钟一样扩大到：

--------------------------------------
| <image>                  <buttons> |
|                          <buttons> |
| <some info here>                   |
|                                    |
--------------------------------------
                 \/

这可能吗？

【问题讨论】：

你解决了这个问题？

标签： android google-maps overlay

【解决方案1】：

使用这个...

没有图标的气球： https://github.com/jgilfelt/android-mapviewballoons#readme
带有图标的气球（扩展 Jeff 吉尔费尔特的项目）： https://github.com/galex/android-mapviewballoons

【讨论】：

【解决方案2】：

创建自定义叠加层，并在 onAdd 覆盖中创建具有所需内容布局的自定义 div。

myOverlay.prototype.onAdd = function(){
  var div = document.createElement('DIV');
  div.style.position = 'absolute';  // so we can position it later.
  // populate the div
  this.div_ = div;
  this.getPanes().overlayLayer.appendChild(div);
}

现在在draw 覆盖中，您可以决定将其放置在地图上的哪个位置。在绘图中，您可以使用在 div 上设置可见性的单击事件处理程序最初绘制标记。

myOverlay.prototype.draw = function(){
  var div = this.div_;
  //populate div with content as required.
  div.style.left = //calculate location based on width / height and centre 
  div.style.top = // ditto
}

【讨论】：