Google 地图中的 FusionTableLayer 可以同时使用 OPTIONS 和 STYLES 吗？

Question

当将来自 Google Fusion table 的地图数据作为图层显示到 Google 地图上时，有一组非常丰富的选项可用于自定义地图特征的外观和信息 window 的内容。看来您可以使用在运行时间生成的自己的 Style/Info Window（即通过客户端代码），或者使用您在 Fusion Tables 工具中创建的那些，但不能两个都。这对于您尝试为给定地图视图自定义的相同 class 行为是有意义的，因为否则会有两个竞争命令用于同一操作。但是，我想知道我是否可以混合搭配它以便在客户端动态生成样式（使用样式 section/directives），但使用 "default" 信息 Window 这是使用 Fusion Tables 工具设置。

以下示例代码说明了我理想中想要做的事情。请注意选项和样式块的存在。使用默认信息的选项 Window。和样式来自定义地图功能的外观。

    layer = new google.maps.FusionTablesLayer({
  ...
  },
  options: {
    //styleID is removed from Options; using Styles below--styleId: 2,
     templateId: 2 //Info Window is left to be the default one.
  }

  //Styles section is used instead of default styleID in "options" above.  
  styles: [{
      where: "filter condition",
      polylineOptions: {
          strokeColor: "#ffbf00",
          strokeWeight: "3"
      }
  }]
});

Answer 1

是的，你可以。样式信息窗口内容在点击事件中可用。

参见the documentation：

FusionTablesMouseEvent 对象规范

The properties of a mouse event on a FusionTablesLayer.

infoWindowHtml | Type:  string | Pre-rendered HTML content, as placed in the infowindow by the default UI.

example fiddle from

代码片段：

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,
    options: {
      // styleId: 2,
      templateId: 2
    },
    heatmap: {
      enabled: false
    },
    query: {
      select: "geometry",
      from: "1D6d93-0iT2zUCw8IvkbpDPYDx2-jA0ZAWXi07mQD",
    },
    styles: [{
      polylineOptions: {
        strokeOpacity: 0.001,
        strokeWeight: 0
      }
    }, {
      where: "SHIFT_ID = 3",
      polylineOptions: {
        strokeOpacity: 1.0,
        strokeColor: "#FFFFFF",
        strokeWeight: 3
      }
    }, {
      where: "SHIFT_ID = 1",
      polylineOptions: {
        strokeOpacity: 1.0,
        strokeColor: "#FF0000",
        strokeWeight: 3
      }
    }, {
      where: "SHIFT_ID = 2",
      polylineOptions: {
        strokeOpacity: 1.0,
        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>

Google 地图中的 FusionTableLayer 可以同时使用 OPTIONS 和 STYLES 吗？

Can OPTIONS and STYLES both be used for FusionTableLayer in Google Maps?

google-maps

google-fusion-tables