单击融合表上可能的信息窗口的新窗口？答案

【问题标题】：new window on click a info window possible on fusion table?单击融合表上可能的信息窗口的新窗口？
【发布时间】：2014-08-26 18:54:09
【问题描述】：

我想要做的是，在信息窗口中添加一个带有 [阅读更多] 的简短数据。当用户单击 [阅读更多] 时，将显示完整数据。在融合表/层上找不到任何文档如何做到这一点，是否可以使用融合？

为了更好的理解

普通信息窗口显示-

    {name}
    {address}

..[Read More]

如果用户点击[阅读更多]

{name}
{address}
{mobile}
{email}
{facebook}
{description}

如果可能，请在融合表/层上分享指南/文档。

【问题讨论】：

标签： google-apps-script google-fusion-tables

【解决方案1】：

可能的解决方案：

像这样创建一个信息窗口模板：

<div class='googft-info-window'>
 {name}<br>
 {address}<br>
 <span class="readmore">[...Read More]</span>
 <div class="more">
  {name}<br>
  {address}<br>
  {mobile}<br>
  {email}<br>
  {facebook}<br>
  {description}<br>
 </div>
</div>

信息窗口现在将有 2 个具有特定类的元素：

```
<div class="more">
```
此元素包含最初应隐藏的元素，通过 CSS 将其隐藏：
```
.gm-style-iw .more{
  display:none;
}
```
<span class="readmore">[...Read More]</span>

您不能在 infoWindow 模板中为该元素分配事件处理程序，而是观察文档中的单击：
```
google.maps.event.addDomListener(document, 'click', function(e){
  if(e.target.className==='readmore'){
    //do something
  }
});
```

如何应用所需的功能：

观察图层上的点击：

 google.maps.event.addListener(layer,'click',function(e,showMore){

    //when the event has been triggered by a real click on the layer
    //the  showMore-argument is undefined
    //store the event-data as properties of the  layer 
    //because we need this data to trigger the click programmatically
    if(!showMore){
      //the complete event-data
      this.eventData=e;
      //store  the unmodified infowWindowHtml separate, because we will modify it
      this.infoWindowHtml=e.infoWindowHtml;
    }
     //wrap the contents in  another div
     //when showMore is defined assign a particular class to the wrapper
     e.infoWindowHtml='<div'+
                      ((showMore)?' class="showmore" ':'')+'>'+
                      this.infoWindowHtml+
                      '</div>';

 });

在上述处理程序中触发对图层的点击并传递 2 个参数：

原始事件

true（这将是showMore-变量）

google.maps.event.addDomListener(document, 'click', function(e){
 if(e.target.className==='readmore'){
  google.maps.event.trigger(layer,'click',layer.eventData,true)
 }
});

infoWindow 将立即再次打开（无需再次请求数据），但需要重新打开，因为 API 必须重新计算 infoWindow 的大小。

使用 CSS 来：

....显示最初隐藏的内容：

.gm-style-iw .showmore .more{
  display:block;
}

...隐藏 阅读更多-span:

.gm-style-iw .showmore .readmore{
  display:none;
}

演示：http://jsfiddle.net/doktormolle/pmrzytfL/

【讨论】：