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);
}
输出:
示例 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);
}
输出:
在线编辑器: https://editor.p5js.org/
环境设置: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/
参考: https://p5js.org/reference/#/p5.Table/findRows