📜  p5.Table findRows() 方法

📅  最后修改于: 2022-05-13 01:56:20.840000             🧑  作者: Mango

p5.Table findRows() 方法

p5.js 中 p5.Table 的findRows() 方法用于查找包含给定和值的所有行,并返回对这些行的引用。可以将方法搜索的列指定为参数。

句法:

findRows( value, column )

参数:该函数接受上面提到的两个参数,如下所述:

  • value:它是一个字符串,指定必须匹配的值。
  • column:它是一个String或Number,表示要搜索的列的列名或列ID。

下面的示例说明了 p5.js 中的findRows() 方法

示例 1:

function setup() {
  createCanvas(500, 300);
  textSize(16);
  
  findQueryInput = createInput();
  findQueryInput.position(30, 50);
  
  getColBtn =
    createButton("Get the matching rows");
  getColBtn.position(30, 80);
  getColBtn.mouseClicked(getFindResults);
  
  // Create the table
  table = new p5.Table();
  
  // Add two columns
  table.addColumn("fruit");
  table.addColumn("price");
  
  // Add some rows to the table
  let newRow = table.addRow();
  newRow.setString("fruit", "Apple");
  newRow.setString("price", 100);
  
  newRow = table.addRow();
  newRow.setString("fruit", "Banana");
  newRow.setString("price", 230);
  
  newRow = table.addRow();
  newRow.setString("fruit", "Grapes");
  newRow.setString("price", 50);
  
  newRow = table.addRow();
  newRow.setString("fruit", "Apple");
  newRow.setString("price", 45);
  
  newRow = table.addRow();
  newRow.setString("fruit", "Apple");
  newRow.setString("price", 65);
  
  showTable();
}
  
function getFindResults() {
  clear();
  
  let findQuery = findQueryInput.value();
  
  // Get the row values using findRows()
  if (findQuery != "") {
  
    // Find the results in the column of 'fruit' 
    findResults =
      table.findRows(findQuery, 'fruit');
  
    if (findResults.length > 0) {
      text("The rows that match the query are",
           20, 120);
  
      // Display the matched rows
      for (let i = 0; i < findResults.length; i++) {
          
        text(findResults[i].arr[0],
             20, 140 + i * 20);
        text(findResults[i].arr[1],
             120, 140 + i * 20);
      }
    }
    else text("No Results Found", 20, 120); 
      
  } else
    text("The query string is empty", 20, 120);
  
    text("Enter a string to find it" +
         " in the table", 20, 20);
}
  
function showTable() {
  clear();
  
  // Display the total rows
  // present in the table
  text("There are " +
       table.getRowCount() +
       " rows in the table", 20, 120);
  
  for (let r = 0; r < table.getRowCount(); r++)
    for (let c = 0; c < table.getColumnCount(); c++)
      text(table.getString(r, c),
           20 + c * 100, 140 + r * 20);
  
      text("Enter a string to find it" +
           " in the table", 20, 20);
}

输出:

findRows-ex1

示例 2:

function setup() {
  createCanvas(500, 300);
  textSize(16);
  
  findQueryInput = createInput();
  findQueryInput.position(30, 50);
  
  getColBtn = 
    createButton("Get the matching rows");
  getColBtn.position(30, 80);
  getColBtn.mouseClicked(getFindResults);
  
  // Create the table
  table = new p5.Table();
  
  // Add two columns
  table.addColumn("fruit");
  table.addColumn("price");
  
  // Add some rows to the table
  let newRow = table.addRow();
  newRow.setString("fruit", "Apple");
  newRow.setString("price", 100);
  
  newRow = table.addRow();
  newRow.setString("fruit", "Banana");
  newRow.setString("price", 100);
  
  newRow = table.addRow();
  newRow.setString("fruit", "Grapes");
  newRow.setString("price", 100);
  
  newRow = table.addRow();
  newRow.setString("fruit", "Apple");
  newRow.setString("price", 50);
  
  newRow = table.addRow();
  newRow.setString("fruit", "Apple");
  newRow.setString("price", 65);
  
  showTable();
}
  
function getFindResults() {
  clear();
  
  let findQuery =
      findQueryInput.value();
  
  // Get the row values using findRows()
  if (findQuery != "") {
  
    // Find the results in the column of 'price' 
    findResults =
      table.findRows(findQuery, 'price');
  
    if (findResults.length > 0) {
      text("The rows that match the query are",
           20, 120);
  
      // Display the matched rows
      for (let i = 0; i < findResults.length; i++) {
          
        text(findResults[i].arr[0],
             20, 140 + i * 20);
        text(findResults[i].arr[1],
             120, 140 + i * 20);
      }
    }
    else text("No Results Found", 20, 120);
      
  } else
    text("The query string is empty", 20, 120);
  
  text("Enter a string to find it" + 
       " in the table", 20, 20);
}
  
function showTable() {
  clear();
  
  // Display the total rows
  // present in the table
  text("There are " +
       table.getRowCount() +
       " rows in the table",
       20, 120);
  
  for (let r = 0; r < table.getRowCount(); r++)
    for (let c = 0; c < table.getColumnCount(); c++)
      text(table.getString(r, c),
           20 + c * 100,
           140 + r * 20);
  
  text("Enter a string to find it" + 
       " in the table", 20, 20);
}

输出:

findRows-ex2

在线编辑器: https://editor.p5js.org/

环境设置: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/

参考: https://p5js.org/reference/#/p5.Table/findRows