【问题标题】:FusionTablesLayer - Get Location column on clickFusionTablesLayer - 点击获取位置列
【发布时间】:2013-09-28 14:34:04
【问题描述】:

我有一个带有 FusionTablesLayer 的 Google 地图,其中显示了德国的铁路(可以在 here 找到融合表)。 geometry 列包含每个要素的 LineString 坐标。

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 文件上传的,作为测试。我今天在另一个帐户 (here) 上导入了完全相同的 KML 文件,并且事件处理程序中不再返回 geometry 列。

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

由于其他一切都完全相同,这很可能是问题所在。我不知道如何对第二个表中的行进行“取消地理编码”。自从一个月前第一个上传以来,我的猜测是 Google 现在会自动对行进行地理编码。

有什么方法可以获取被点击的功能的geometry 列?

注意:这绝对是可能的,即使 geometrycolumn 已进行地理编码。在第二个表的“几何图”选项卡中,您可以选择单击要素时信息窗口中显示的列。有关工作演示,请参阅 here

【问题讨论】:

    标签: google-maps google-maps-api-3 google-fusion-tables


    【解决方案1】:

    具有 KML 数据的行不会包含在行中(我不确定这是否一直如此)。

    我猜 KML 功能已被省略以节省带宽

    你可以做什么:

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

    但自动信息窗口模板只显示坐标,使用动态模板,例如

    {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 中,它不会显示在 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/

    【讨论】:

    • 这也是我的第一个想法,但如您所知,这不是一个可靠的解决方案。它注定会在某个时间点中断(如果 Google 更新了 FusionTablesLayer InfoWindow)。这就是为什么我选择添加一个额外的列,该列包含与geometrycolumn 完全相同的详细信息,除了它是“文本”类型。我知道这加起来就是总大小,但它似乎是一个更可靠的解决方案。
    • 我不会称添加列副本更可靠。一个更可靠的解决方案是给列一个唯一的 id 并通过 AJAX 请求几何。
    猜你喜欢
    • 1970-01-01
    • 2014-05-14
    • 1970-01-01
    • 2020-10-03
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-03-26
    • 1970-01-01
    相关资源
    最近更新 更多