FusionTablesLayer - 获取位置栏点击

问题描述:

我有一个显示德国铁路的FusionTablesLayer的Google Maps(融合表可以找到here)。 geometry列包含每个要素的LineString坐标。FusionTablesLayer - 获取位置栏点击

var railwaysLayer = new google.maps.FusionTablesLayer({ 
    map: map, 
    query: { 
     select: 'geometry', 
     from: '1cVaJLbbxgBErP8PzYkHP-lpWMN8wUmINbdAJS1Y' 
    } 
}); 

当用户点击铁路时,我需要知道点击了哪个行(或实际功能)。这可以在click事件处理程序来完成这样的:

google.maps.event.addListener(existingRailwaysLayer, 'click', function(e) { 
    console.log(e.row.geometry.value); 
}); 

可正常工作,但这里的问题:本表得到了上传一个月前从KML文件作为测试。我今天在另一个帐户上导入了完全相同的KML文件(here),并且geometry列不再在事件处理程序中返回。

我检查了所有设置,发现在这两个表中,geometry列的类型为Location。但是:在第一个表中,这些行不是地理编码的。 File > Geocode > Begin geocoding有效地启动了对每行进行地理编码的过程,而在第二个表中则显示:“列已完全地理编码”。

因为一切都完全一样,所以这可能是问题所在。我不知道如何对第二个表格中的行进行“非地理编码”。自从第一次上传一个月前,我猜测Google现在会自动对行进行地理编码。

有什么办法让点击的功能的geometry列?

注意:即使在geometry列进行了地理编码,这绝对是可能的。在第二个表格的“几何图形”选项卡中,可以选择在单击某个功能时显示在infoWindow中的列。查看here进行工作演示。

包含KML数据的行将不会包含在行中(我不确定这是否始终存在)。

我猜的KML的功能已经ommitted节省带宽

你可以做什么:

解析e.infoWindowHtml(因为你已经注意到它可以打印几何特征的信息窗口,e.infoWindowHtml包含用作InfoWindow内容的字符串)。

但是,自动InfoWindow模板只显示坐标,使用动态模板,例如,

{template .contents} 
<div class='googft-info-window'> 
<b>description:</b> {$data.formatted.description}<br> 
<b>name:</b> {$data.formatted.name}<br> 
<div style="width:0;height:0;overflow:hidden;">[[{$data.value.geometry}]]</div> 
</div> 
{/template} 

(你可以使用这个模板,你的表,我已经创造了它,它具有templateId:6

正如你所看到的几何形状嵌入一个div没有大小,YIT不会在InfoWindow中显示。 几何形状放在方括号内,使用正则表达式来找到它:

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

    var str = e.infoWindowHtml, geo; 

    if(geo=str.match(/\[\[([^\]]+)]]/)){ 
     geo=geo[1].replace(/(&gt;|&lt;)/g,function(x){ 
      return((x==='&gt;')?'>':'<'); 
      }); 
     console.log(geo); 
    } 
}); 

演示:(用你的表我的模板)http://jsfiddle.net/doktormolle/9YdKW/

+0

这也是我的第一个想法,但如你所知,这是不是一个可靠的解决方它注定要在某个时间点中断(如果Google更新了FusionTablesLayer InfoWindow)。这就是为什么我选择添加一个额外的列,其中保留与'几何'列完全相同的细节,除了它是'文本'类型。我知道这增加了总规模,但它似乎是一个更稳固的解决方案。 –

+0

我不会称之为添加更多实体的列副本。一个更可靠的解决方案是给列赋一个唯一的id并通过AJAX请求几何。 –