" WHERE"在Google地图的Fusion Table Layer中忽略了子句

时间:2015-11-12 04:58:00

标签: javascript google-maps google-fusion-tables

我正在尝试通过API将Google Fusion表格用作Google地图中的图层。只需使用FusionTableLayer()将图层添加到Google地图就行了。我可以看到地图和所有。 "有趣"当我尝试将过滤器(即" where子句")应用于选择查询或样式部分时开始。过滤器不起作用!它不会抛出任何错误。地图继续工作。但是结果集没有被过滤掉 - 好像where子句甚至没有。对于'其中'的相同症状。用于样式部分的子句。它完全被忽略了。我有三种不同的样式,我想根据过滤条件应用它。所有这些都被忽略了。奇怪的是,样式块中列出的最后一个样式部分将应用于融合表层中的所有要素。我通过切换部分来验证它。我尝试用" col10"等引用替换实际的字段名称,但这没有任何区别。

我错过了什么?我怎样才能启用"在我的FusionTableLayer中使用WHERE子句,以便它们既可以在Select查询中应用,也可以在Styles部分中应用?

注意:在下面的代码段中,为此帖子插入了(//)注释。我正在开发的实际页面/代码中不存在这些注释。

  layer = new google.maps.FusionTablesLayer({
  map: map,
  heatmap: { enabled: false },
  query: {
     select: "col11",
     from: "1D6d93-0iT2zUCw8IvkbpDPYDx2-jA0ZAWXi07mQD",
     //the following filter in select query does not work! 
     //I replaced col10 with actual field name (shift_id) but still EVERYTHING from the table is returned
     where: "col10 <= 3" 
  },
        styles: [{
          //this where clause has no effect. I've tried replacing shift_id with col10.
          where: "((shift_id != 1) AND (shift_id != 2))",
          polylineOptions: {
            strokeColor: "#FFFFFF",
            strokeWeight: "3"  }
        }, {
          //this where clause has no effect. I've tried replacing shift_id with col10.
          where: "shift_id == 1",
          polylineOptions: {
            strokeColor: "#FF0000",
            strokeWeight: "3"  }
        }, {
          //this where clause has no effect. I've tried replacing shift_id with col10.
          //whichever of these three blocks is listed last is the one that gets applied to the layer.
          where: "shift_id == 2",
          polylineOptions: {
            strokeColor: "#ffbf00",
            strokeWeight: "3"  }
        }] 
});

2 个答案:

答案 0 :(得分:2)

两个建议:

  1. 确保您在选择查询中过滤的列被格式化为数字,而不是文本,因为您正在检查<=;以及

  2. 列名称区分大小写 - 您在Fusion表中使用了大写SHIFT_ID

答案 1 :(得分:1)

  1. “==”不起作用,请使用“=”
  2. 不包括主查询中的位置
  3. layer = new google.maps.FusionTablesLayer({
        map: map,
        heatmap: {
            enabled: false
        },
        query: {
            select: "geometry",
            from: "1D6d93-0iT2zUCw8IvkbpDPYDx2-jA0ZAWXi07mQD",
        },
        styles: [{
            where: "((SHIFT_ID != 1) AND (SHIFT_ID != 2))",
            polylineOptions: {
                strokeColor: "#FFFFFF",
                strokeWeight: "3"
            }
        }, {
            where: "SHIFT_ID = 1",
            polylineOptions: {
                strokeColor: "#FF0000",
                strokeWeight: "3"
            }
        }, {
            where: "SHIFT_ID = 2",
            polylineOptions: {
                strokeColor: "#ffbf00",
                strokeWeight: "3"
            }
        }]
    });
    

    proof of concept fiddle

    代码段

    var geocoder = new google.maps.Geocoder();
    var map;
    
    function initialize() {
      var map = new google.maps.Map(
        document.getElementById("map_canvas"), {
          center: new google.maps.LatLng(37.4419, -122.1419),
          zoom: 13,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        });
      layer = new google.maps.FusionTablesLayer({
        map: map,
        heatmap: {
          enabled: false
        },
        query: {
          select: "geometry",
          from: "1D6d93-0iT2zUCw8IvkbpDPYDx2-jA0ZAWXi07mQD",
        },
        styles: [{
          where: "((SHIFT_ID != 1) AND (SHIFT_ID != 2))",
          polylineOptions: {
            strokeColor: "#FFFFFF",
            strokeWeight: "3"
          }
        }, {
          where: "SHIFT_ID = 1",
          polylineOptions: {
            strokeColor: "#FF0000",
            strokeWeight: "3"
          }
        }, {
          where: "SHIFT_ID = 2",
          polylineOptions: {
            strokeColor: "#ffbf00",
            strokeWeight: "3"
          }
        }]
      });
      geocoder.geocode({
        'address': "Winnipeg, Canada"
      }, function(results, status) {
        if (status === google.maps.GeocoderStatus.OK) {
          map.fitBounds(results[0].geometry.viewport);
        } else {
          alert('Geocode was not successful for the following reason: ' + status);
        }
      });
    }
    google.maps.event.addDomListener(window, "load", initialize);
    html,
    body,
    #map_canvas {
      height: 100%;
      width: 100%;
      margin: 0px;
      padding: 0px
    }
    <script src="https://maps.googleapis.com/maps/api/js"></script>
    <div id="map_canvas"></div>