为什么谷歌的infoWindow CSS没有暴露？定制太难了

Question

这真的让我很烦。

在firebug中费力地阅读了google maps v3生成的客户端代码后，我准备开车到街上，给这些工程师们一些我的想法…arrrgh: P

infowWindow类生成的HTML我个人认为简直是疯了。也许有人能帮我弄明白。

infowWindow的HTML结构如下:

#map_canvas > div > div > div > div > div // 5 levels of elements, 
no big deal here, ok...
> div // top left corner
div // top right corner
div // bottom left corner
div // bottom right corner
// now comes fun stuff for the speech bubble arrow:
div
div
div
div
div
div
div
div
div
div
// the 10 divs above are stacked diagonally with odd sizes to make this arrow. 
i'm sorry but WHY?!? is it done like that? I suppose they wanted the user to be 
able to grab the map even right next to the arrow. Think about this: do users 
really need to be able to not grab the arrow? if grabbing the arrow causes map pan, 
as is the case for the shadow images, would that really be a problem?
div // bottom middle for image background border or something
div // top middle
div // middle
div // bottom middle, again
div // entire block of the infoWindow, probably the container
> img // close box
div // center block with the contents of the infoWindow
div // text content container

哇!

注意这里没有真正的语义结构，而且-天哪，我敢有这样一个假设-没有任何类名，什么都没有。我想也许他们有类似于9片的盒子然后分别产生箭头;我的意思是,图片Sprite在iw3.png肯定不会是这里的问题。

我非常希望对这个api有影响的人遇到这个和希望谷歌最终能找到解决这个问题的方法infoWindow的视觉效果就像标记一样简单。

感谢收看!快乐的评论。

与此同时，我将使用一个hack来接近这些疯狂的潜水者，让他们听我的命令。

---

早些时候我评论了其他一些帖子，我认为在API中要求一个方法让你使用自定义UI，而不需要像目前需要的那样诉诸于整个窗口对象的近乎复制(参见google扩展类v3)。

google.maps.infoWindow.setStyle({
  'topleft' : {
    'background' : 'url(images/windowsprite.png) 0 0 no-repeat',
    'width' : '10px',
    'height' : '10px'
  },
  'topRight' : {
     ...etc...
  }
  ...etc...
})

Answer 1

你试过InfoBox吗?

http://googlegeodevelopers.blogspot.com/2010/04/infobox-10-highly-customizable.html

或InfoBubble吗?

http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobubble/examples/example.html/

它们都让你对信息窗口的外观有了更多的控制，同时仍然抽象了一些复杂的部分。

元素上缺少类是API的一个(好的)设计决策。它消除了与用户定义类冲突的可能性。

Answer 2

经过多次尝试和错误后，我决定解决这个问题的最佳方法是使用OverlayView类并简单地自定义构建容器。说"简单"有点轻描淡写了，但确实管用。现在我可以完全控制布局和功能了

Answer 3

你试过用CSS样式吗?下面的示例展示了这一点。这是修改UI最直接的方法。

http://code.google.com/apis/maps/documentation/javascript/overlays.html InfoWindows