2012-06-27 31 views
0

我有這個JavaScript代碼。我想要地圖上的2個按鈕。 1將layer_2'打開',其他將layer_1'打開'。一旦任一按鈕被點擊,其他圖層應該關閉。此外,layer_1需要是默認的,並且應在地圖打開時顯示。在任何情況下層都不應該重疊。想要切換從2個不同的融合表生成的圖層

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

} 

回答

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

UPDATE:一個真正的toogle會是什麼樣子:

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

謝謝[email protected] 當我刪除「layer_2.setMap(地圖);」並在外部添加切換功能,它不起作用。我點擊按鈕,但他們不工作。 – mmittal

+0

Layer_1在點擊按鈕時消失,但layer_2不會打開 – mmittal

+0

我明白了! – mmittal