2013-08-01 71 views
0

大家好,並提前感謝您的意見和建議。過濾器查詢融合表不工作

1 - 我有過濾以可下載和公共表「1wPUbMMUyZQkrodr7zk6-_mYJmH4RPc48NvDuzBY」

2兩列(信道和扇區)的問題 - 從表樣式並不在地圖上顯示。

這是我使用的代碼。請隨時諮詢或更正。

<!DOCTYPE html> 
    <html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Malawi EN</title> 
    <!-- Style --> 
    <style> 
    body { font-family: Arial, sans-serif; } 
    #map_canvas { height: 700px; width:1056px; } 
    </style> 
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
    <script type="text/javascript"> 

    var tableid = "1wPUbMMUyZQkrodr7zk6-_mYJmH4RPc48NvDuzBY"; 
    var layer = new google.maps.FusionTablesLayer(tableid); 
    function initialize() { 
    map = new google.maps.Map(document.getElementById('map_canvas'), { 
    center: new google.maps.LatLng(-13.731381,34.002686), 
    zoom: 7, 
    mapTypeControl: true, 
    panControl: false, 
    zoomControl: true, 
       zoomControlOptions: { 
       style: google.maps.ZoomControlStyle.SMALL 

    }, 

    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    streetViewControl:false 
    }); 
    layer.setMap(map); 

    } 

    //Change the query based on the user's selection 
    function changeMap(sector, channel) { 
    sector = document.getElementById('sector').value; 
    channel = document.getElementById('channel').value; 
    layer.setQuery("SELECT lat FROM " + tableid + " WHERE sector MATCHES '%" + sector + "%' AND  channel MATCHES '" + channel + "'"); 
    } 
    </script> 
    </head> 
    <body onLoad="initialize();"> 
    <h3>Malawi</h3> 


     Channel of Aid: <select id="channel" onChange="changeMap();"> 
     <option value="%"> All </option> 
     <option value="bilateral">Bilateral</option> 
     <option value="multilateral">Multilateral</option> 
     <option value="partnership">Partnership</option> 
    </select> 

     Sector: <select id="sector" onChange="changeMap();"> 
     <option value="%"> All </option> 
     <option value="Improving health">Improving health</option> 
     <option value="Private sector development">Private sector development</option> 
     <option value="Environment">Environment</option> 
     <option value="Democratic governance">Democratic governance</option> 
     <option value="Strengthening basic education">Strengthening basic education</option> 
     <option value="Peace and security">Peace and security</option> 
     <option value="Emergency assistance">Emergency assistance</option> 
     <option value="Other">Other</option> 
    </select> 

    <div id="map_canvas"></div> 
    </body> 
    </html> 

回答

0

您的代碼中有很多小錯誤,我創建了一個working example of your code on jsFiddle

您需要正確初始化FusionTablesLayer。它需要一個配置對象,你可以定義的東西,如查詢使用或適用的風格:

var tableid = "1wPUbMMUyZQkrodr7zk6-_mYJmH4RPc48NvDuzBY"; 

    var layer = new google.maps.FusionTablesLayer({ 
     query: { 
      select: 'lat', 
      from: tableid 
     }, 
     styleId: 2, 
     templateId: 2 
    }); 

styleId定義元素如何看待網頁上,id爲兩個風格是你所定義的一個在你的Fusion Table中。 templateId定義InfoWindow(當您點擊地圖上的某個項目時)應使用哪個模板。再次,id 2是您定義的那個。

過濾部分幾乎是正確的,只是您使用的舊語法不能再與加密的表ID一起使用。我固定的,其使用layer.setOptions新的語法:

function changeMap() { 
    sector = document.getElementById('sector').value; 
    channel = document.getElementById('channel').value; 
    where = " sector LIKE '%" + sector + "%'"; 
    where += " AND channel LIKE '%" + channel + "%'"; 

    layer.setOptions({ 
     query: { 
      select: 'lat', 
      from: tableid, 
      where: where 
     } 
    }); 
} 
+0

非常感謝您對看代碼,並協助我一個答案,我真的很感謝您的幫助! – user1214134

+0

@ user1214134如果這個答案對您有幫助,請考慮[接受它](http://stackoverflow.com/help/accepted-answer)。 – Odi