从Google Spreadsheets进行JSON过滤

时间:2018-11-15 16:35:31

标签: javascript json filter google-sheets spreadsheet

我有两段代码,很难弄清楚如何将它们组合在一起。

第一个从Google Spreadsheet中获取JSON,然后将数据放入字符串中。

  var jsonSource = "https://spreadsheets.google.com/feeds/list/1cDoIo8QG2k4pzBC_Mx5k7CCi_rZRlEsZAOSb8QY00vk/od6/public/values?alt=json"

  //fetch the json feed
  $.getJSON( jsonSource, function() {
    $("<p>json request successful</p>").prependTo("#container");
  })

  .done(function(data) { 
    if (data.feed.entry.length > 0) {
      var $rand = Math.floor(Math.random() * data.feed.entry.length);
      $.each( data.feed.entry, function( i, item ) {
        var $name = item[$rand].gsx$name.$t;
        var $info = item.gsx$info.$t;
        var $dataquick = item.gsx$dataquick.$t;
        var $datadrink = item.gsx$datadrink.$t;
        var $datahappy = item.gsx$datahappy.$t;
        var $hours = item.gsx$hours.$t;
        var $happyhour = item.gsx$happyhour.$t;
        var $x = item.gsx$x.$t;
        var $y = item.gsx$y.$t;
        var $img = item.gsx$img.$t;
        var $happyhourlist;
        if ($datahappy == "FALSE") {
          $happyhourlist = "";
        } else {
          $happyhourlist = $happyhour;
        };
          $('<div class="container" id="answer"><div class="row justify-content-sm-center"><div class="col-md-12 cells"><img src="' + $img + '" style="width:250px;height:250px;float:right;"><p>' + $info + '</p></div></div><div class="row justify-content-sm-center"><div class="col-md-12 cells"><h3>hours</h3></div></div><div class="row justify-content-sm-center"><div class="col-md-12 cells"><h3>happy hours</h3></div></div><div class="row justify-content-sm-center"><div class="col-md-12 cells"><h3>location</h3><div class="where"><div class="maps"><iframe src="https://www.google.com/maps/embed?pb=!1m26!1m12!1m3!1d3066.84554775914!2d-86.16056328462379!3d39.76557607944616!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!4m11!3e6!4m5!1s0x886b50bc12e1255b%3A0x1e64cf5eed1c326b!' + $x + ',' + $y + '!3m2!1d3' + $x + '!2d' + $y + '!4m3!3m2!1d' + $x + '!2d' + $y + '!5e0!3m2!1sen!2sus!4v1542066257172"></iframe></div> </div></div></div></div>').appendTo(".newItem");
      });      
      //   $('<div style="background:white;margin:10px 0px;padding:10px;"><div>' + $name + 
      //       "</div><div>" + $img + 
      //       "</div><div>" + $info + 
      //       "</div><div>" + $dataquick + 
      //       "</div><div>" + $datadrink + 
      //       "</div><div>" + $datahappy + 
      //       // "</td><td>" + $docLink + 
      //       "</div><div>" + $hours + 
      //       "</div><div>" + $happyhourlist + 
      //       "</div><div>" + $x + 
      //       "</div><div>" + $y + 
      //       "</div></div>").appendTo(".newItem");
      // });
    } else {
      // if the json request is successful but there are no items
      $("<p>JSON request succeeded but no data returned.</p>").prependTo("#container");
    }
  })

  .fail(function() {
    $("<p>JSON request fail</p>").prependTo("#container");
  })

  .error(function() {
    $("<p>JSON request error</p>").prependTo("#container");
  });

代码的第二部分是使用一些JS,过滤信息并输出与前一个几乎相同的结构,但是我不确定如何将它们组合起来。

const placesToEat = [
  {
    name: "NAME",
    img: "IMG",
    quick: false,
    drink: true,
    happy: true,
    info: "INFO",
    hours: 
      "HOURS",
      happyhour: 
        "HAPPY HOUR",
    x: "XXXX",
    y: "YYYYY"
  }
];


function decidePlace() {
  const placesToEatFiltered = 
        // quick
        placesToEat.filter( place => {
          needQuick = doc('quick').checked;
          return (needQuick)?place.quick:true;
        })
        // drink
        .filter( place => {
          needDrink = doc('drink').checked;
          return (needDrink)?place.drink:true;
        })
        // happy
        .filter( place => {
          needHappy = doc('happy').checked;
          return (needHappy)?place.happy:true;
        });
  const rand = Math.floor(Math.random() * placesToEatFiltered.length);
  const choice = placesToEatFiltered[rand].name;
  const img = placesToEatFiltered[rand].img;
  const info = placesToEatFiltered[rand].info;
  const hours = placesToEatFiltered[rand].hours;
  const happyhour = placesToEatFiltered[rand].happyhour;
  const x = placesToEatFiltered[rand].x;
  const y = placesToEatFiltered[rand].y;
  const zoomLevel = 0;
  const zoom = 15 + zoomLevel;
  document.getElementById('output').innerHTML = '<div class="container"><div class="row justify-content-sm-center"><div class="col-md-12 cells"><img src="' + img + '" class="brand_logo">' + info + '</div></div></div><div class="container"><div class="row justify-content-sm-center"><div class="col-md-12 cells">' + hours + "</div></div></div><div class='container'><div class='row justify-content-sm-center'><div class='col-md-12 cells'>" + happyhour + "</div></div></div><div class='container'><div class='row justify-content-sm-center'><div class='col-md-12 cells'><h3>location</h3><div class='where'><div class='maps'><iframe src='https://www.google.com/maps/embed?pb=!1m26!1m12!1m3!1d3066.84554775914!2d-86.16056328462379!3d39.76557607944616!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!4m11!3e6!4m5!1s0x886b50bc12e1255b%3A0x1e64cf5eed1c326b!" + x + "," + y + "!3m2!1d3" + x + "!2d" + y + "!4m3!3m2!1d" + x + "!2d" + y + "!5e0!3m2!1sen!2sus!4v1542066257172'></iframe></div></div></div></div>" ;
}

function doc(string) {
  return document.getElementById(string);
}

我正在尝试通过步骤思考,使他们聚在一起。从电子表格中获取JSON,对数据进行过滤,在所选过滤器中输出电子表格的随机行。

很抱歉我对JSON / JS缺乏经验,但我正在学习。非常感谢您为我提供的任何帮助。

0 个答案:

没有答案