如何在Google Fusion Table的同一桌面/图层上构建多个下拉选择器菜单?

时间:2012-02-22 17:20:51

标签: javascript google-fusion-tables

我在我的网站上创建了一系列Google Fusion Table maps社区媒体数据库, 允许用户打开和关闭多个图层。对于每一层,我还构建了一个下拉选择菜单,允许查看器根据该选择器过滤显示的结果。

我现在处于需要为每个图层创建多个下拉选择菜单的位置。为了简单起见,在链接地图中,我想让观众不仅可以通过管理类型来查看接入电视提供商,还可以通过本地选举相关节目以及其他许多字段来查看接入电视提供商。

我仍然是Googgle FT的新手,并且几乎不了解JavaScript。我曾尝试复制和粘贴一些代码示例,但我相信我没有正确建立唯一变量。他们以某种方式结束了冲突,但没有一个能够奏效。

有人可以帮助我了解在单个Google Fusion Table /地图图层上创建多个选择菜单的简单方法吗?谢谢!

~Rob McCausland,CommunitymediaDatabase.org

1 个答案:

答案 0 :(得分:2)

问题是,您可以从选择列表中检索值。我为所有选择列表提供了一个id,并使用jQuery.js来访问这些值:

var value = $('#program_select_id')。val();

其次是通过'AND'链接您的查询条件,您的代码似乎已经掌握了这些条件。

以下是我使用的一些jQuery依赖代码的示例:

<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 

<script type="text/javascript">

function setQuery(ft_layer, current_table_id, location_col)
{
    var query = [];

    var value = $('#program_select_id').val();
    if(value !== ''){
        query.push("'program' = '" +  value + "'");
    }
    value = $('#provider_select_id').val();
    if(value !== ''){
        query.push("'data_provider' = '" +  value + "'");
    }
    value = $('#observable_select_id').val();
    if(value !== ''){
        query.push("observables CONTAINS '" + value + "'");
    }

    var where = query.join(' AND ');

    var qryOpts = {
      query: {
        select: location_col,
        from: current_table_id,
        where: where
      }
    };
    ft_layer.setOptions(qryOpts);
}

</script>