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

Question

我有这个 JavaScript 代码。我想要地图上的 2 个按钮。1 将 layer_2 设为“ON”，其他将 layer_1 设为“ON”。单击任一按钮后，另一层应关闭。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();

}

Answer 1

在初始化函数中删除这一行：

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);">

更新：一个真正的工具看起来像：

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