想要切换从2个不同融合表生成的图层

时间:2012-06-27 17:09:10

标签: javascript toggle layer google-fusion-tables

我有这个JavaScript代码。我想要地图上的2个按钮。 1将layer_2'打开',另一个将layer_1'打开'。单击任一按钮后,其他图层应关闭。 layer_1也需要是默认值,并且应该在打开地图时显示。在任何情况下,图层都不应重叠。

var map;
var layer_1;
var layer_2;
var tableid_1 = 3775630;
var tableid_2 = 4313734;
var queryUrlHead = 'http://www.google.com/fusiontables/api/query?sql=';
var queryUrlTail = '&jsonCallback=?';

function initialize(col_list, order_list) {
var latlng = new google.maps.LatLng(33.7071,-111.3024);

map = new google.maps.Map(document.getElementById('map_canvas'), {
    center: latlng,
    zoom: 7,
    mapTypeId: google.maps.MapTypeId.TERRAIN,
    mapTypeControl: true,
    mapTypeControlOptions: {
    style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
    position: google.maps.ControlPosition.TOP_LEFT
},
    scaleControl: true,
    scaleControlOptions: {
    position: google.maps.ControlPosition.BOTTOM_LEFT
},

});

var layer_2 = new google.maps.FusionTablesLayer(4313734);
layer_2.setMap(map);

var layer_1 = new google.maps.FusionTablesLayer(3775630);
layer_1.setMap(map);
layer_1.enableMapTips({
        select: "'Name'",
        from: tableid_1,
        geometryColumn: 'Location', 
        suppressMapTips: false, 
        delay: 50,
        tolerance: 5
});
    addListeners();

}

1 个答案:

答案 0 :(得分:0)

在初始化函数中删除此行:

layer_2.setMap(map);

在初始化函数之外创建此函数。

function toggleLayer(this_layer){
        layer_1.setMap(null);
        layer_2.setMap(null);
        this_layer.setMap(map);
}

创建一些按钮:

<input type="button" value="Turn on Layer 1" onClick="toogleLayer(layer_1);">
<input type="button" value="Turn on Layer 2" onClick="toogleLayer(layer_2);">

更新:一个真正的toogle看起来像:

function toggleLayer(this_layer){
   if(this_layer.getMap(){
     this_layer.setMap(null);
   }else{
     this_layer.setMap(map);
   }
}