标记结果列表未显示,(google-fusion-tables template derek)

时间:2015-02-24 14:46:31

标签: google-maps templates google-fusion-tables

我正在尝试使用Derek制作的模板创建一个可搜索的地图。 成功设置复选框后,我尝试显示符合derek instructions的结果列表。 div是可见的,但结果却丢失了。 (对不起,我对javaskript不太熟悉,但我克服了我在这里发帖的犹豫。)

这是索引的一部分:

           <p>Take a look at the <a href='https://github.com/derekeder/FusionTable-Map-Template/wiki/Filter-examples'>wiki</a> to see how to add your own custom filters and views like:</p>
<h4>
  Recycling services
</h4>
<ul class='inputs-list unstyled'>
  <li>
    <label class='checkbox inline'>
      <input type='checkbox' id='cbType1' />
      <span class='filter-box filter-blue'></span>
      City drop-off location
    </label>
  </li>
  <li>
    <label class='checkbox inline'>
      <input type='checkbox' id='cbType2' />
      <span class='filter-box filter-green'></span>
      Private business
    </label>
  </li>
</ul>
<div class='well'>
  <div id='results_list'></div>
</div>

maps_lib.js看起来像这样:

self.submitSearch = function(whereClause, map) {
  var self = this;

  //get using all filters
  //NOTE: styleId and templateId are recently added attributes to load custom marker styles and info windows
  //you can find your Ids inside the link generated by the 'Publish' option in Fusion Tables
  //for more details, see https://developers.google.com/fusiontables/docs/v1/using#WorkingStyles
  self.searchrecords = new google.maps.FusionTablesLayer({
    query: {
      from: self.fusionTableId,
      select: self.locationColumn,
      where: whereClause
    },
    styleId: 2,
    templateId: 2
  });
  self.fusionTable = self.searchrecords;
  self.searchrecords.setMap(map);
  self.getCount(whereClause);
  MapsLib.getList(whereClause);

};

并在maps_lib.js中进一步向下

getList= function(whereClause) {
    var selectColumns = 'Name, Ort ';

    MapsLib.query({ 
      select: selectColumns, 
      where: whereClause 
    }, function(response) { 
      MapsLib.displayList(response);
    });
  },

  displayList= function(json) {
    MapsLib.handleError(json);
    console.log(json)
    var data = json['rows'];
    var template = '';

    var results = $('#results_list');
    results.hide().empty(); //hide the existing list and empty it out first

    if (data == null) {
      //clear results list
      results.append("<li><span class='lead'>No results found</span></li>");
    }
    else {
      for (var row in data) {
        template = "\
          <div class='row-fluid item-list'>\
            <div class='span12'>\
              <strong>" + data[row][0] + "</strong>\
              <br />\
              " + data[row][1] + "\
              <br />\
              " + data[row][2] + "\
              <br />\
              " + data[row][3] + "\
            </div>\
          </div>";
        results.append(template);
      }
    }
    results.fadeIn();
  },

0 个答案:

没有答案