Javascript 用于查询融合表的筛选器无效_Javascript_Google Fusion Tables

Javascript 用于查询融合表的筛选器无效

javascript

Javascript 用于查询融合表的筛选器无效,javascript,google-fusion-tables,Javascript,Google Fusion Tables,大家好，提前感谢大家的评论和建议 1-我在可下载的公共表1wPUbMMUyZQkrodr7zk6-_mYJmH4RPc48NvDuzBY中筛选两列通道和扇区时遇到问题 2-表格中的样式不会显示在地图上这是我正在使用的代码。请随时提出建议或纠正 <!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalab

大家好，提前感谢大家的评论和建议

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>

你的代码中有很多小错误，我创建了一个

您需要正确初始化FusionTablesLayer。它采用一个配置对象，您可以在其中定义要使用的查询或要应用的样式：

var tableid = "1wPUbMMUyZQkrodr7zk6-_mYJmH4RPc48NvDuzBY";

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

styleId定义元素在页面上的外观，id为2的样式是您在Fusion表中定义的样式。templateId定义了当您单击地图上的某个项目时，应将哪个模板用于InfoWindow。同样，ID2是您定义的

过滤部分几乎是正确的，只是使用了旧语法，不能再用于加密的表ID。我修复了使用layer.setOptions使用新语法的问题：

非常感谢您查看代码并帮助我回答问题，我非常感谢您的帮助@USER 1214134如果这个答案对你有帮助，请考虑。

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