【问题标题】:Suppress fusion table infowindow with multiple layers抑制具有多个层的融合表信息窗口
【发布时间】:2012-08-20 16:54:21
【问题描述】:

我有一张包含两个融合表层的地图,并且正在使用suppressInfoWindows,这样当用户单击另一层的标记时,一层的信息窗口不会打开。使用以下代码可以正常工作:

<script type="text/javascript">
var map;
var infowindow;

var layer;
var tableid = MY FUSION TABLE ID;

var layer2;
var tableid2 = MY FUSION TABLE ID;

function initialize() {

  map = new google.maps.Map(document.getElementById('map_canvas'), {
    center: new google.maps.LatLng(10, 30),
    zoom: 2,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });

 infoWindow = new google.maps.InfoWindow();

 google.maps.event.addListener(map, "click", function() { infoWindow.close(); });

 layer = new google.maps.FusionTablesLayer(tableid, {suppressInfoWindows:true});
 layer.setQuery("SELECT 'Country Geometry' FROM " + tableid);
 layer.setMap(map);
 google.maps.event.addListener(layer, "click", openIW);

 layer2 = new google.maps.FusionTablesLayer(tableid2, {suppressInfoWindows:true});
 layer2.setQuery("SELECT 'Site Location' FROM " + tableid2);
 layer2.setMap(map);
 google.maps.event.addListener(layer2, "click", openIW);

}

function openIW(FTevent) {
  // infoWindow.setContent(FTevent.infoWindowHtml);
  // infoWindow.setPosition(FTevent.latLng);
  infoWindow.setOptions(
    { 
     content: FTevent.infoWindowHtml,
     position: FTevent.latLng,
     pixelOffset: FTevent.pixelOffset
    });

  infoWindow.open(map);
}

</script>

我现在如何将自定义 html 添加到信息窗口,而不是依赖 Fusion Tables 中的信息窗口设置?我在添加suppressInfoWindows 选项之前使用的代码如下,但我不确定现在如何以正确的格式重新添加它。此外,是否可以为不同层上的信息窗口使用不同的 html 代码,或者两个层都必须使用相同的信息窗口?谢谢。

e.infoWindowHtml =  "<div id='SiteInfo' class='googft-info-window' style='font-family: sans-serif; width: 500px; height: 300px; overflow: auto;'>\
            <b>" + e.row['Site Name'].value + "</b><br />\
            </div></div>";

【问题讨论】:

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


    【解决方案1】:

    请参阅我对您的last question 的回答中的示例。

    Example of your map with 2 layers, 1 infowindow

    实施:

    1. 抑制两层的信息窗口
    2. 编写代码以在单击任一图层时打开共享信息窗口。

    【讨论】:

    • 完美!非常感谢,这节省了我几个小时。
    猜你喜欢
    • 2016-03-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-04-17
    • 2014-12-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多