p5.js 表格 removeColumn() 方法
p5.js 中 p5.Table 的removeColumn() 方法用于从表中删除给定的列。可以通过使用其标题或索引值(列 ID)来指定要删除的列。
句法:
removeColumn( column )
参数:此函数接受如上所述和如下所述的单个参数:
- column:它是一个字符串或数字,表示要删除的列名或列 ID。
下面的示例说明了 p5.js 中的removeColumn()函数:
示例 1:
function setup() {
createCanvas(500, 400);
textSize(16);
removeColBtn =
createButton("Clear Last Column");
removeColBtn.position(30, 60);
removeColBtn.mouseClicked(clearLastColumn);
// Create the table
table = new p5.Table();
// Add columns
table.addColumn("author");
table.addColumn("book");
table.addColumn("price");
table.addColumn("rating");
// Add 10 random rows to the table
for (let i = 0; i < 10; i++) {
let newRow = table.addRow();
newRow.setString("author",
"Author " + floor(random(1, 100)));
newRow.setString("book",
"Book " + floor(random(1, 100)));
newRow.setString("price",
"$" + floor(random(10, 100)));
newRow.setString("rating",
random(1, 5).toFixed(2));
}
// Display the rows currently present
getTableRows();
}
function clearLastColumn() {
clear();
text("Click on the button to clear "
+ "the last column in the table",
20, 20);
// Get the index of the last column
// of the table
let lastColumn =
table.getColumnCount() - 1;
// Use the removeColumn() method to
// clear the given column of the table
if (lastColumn >= 0)
table.removeColumn(lastColumn);
text("Last column cleared!", 20, 140);
getTableRows();
}
function getTableRows() {
clear();
text("Click on the button to clear "
+ "the last column in the table",
20, 20);
// Display the total columns
// present in the table
text("There are " +
table.getColumnCount() +
" columns in the table", 20, 120);
// Show the table with the columns and rows
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);
}
输出:
示例 2:
function setup() {
createCanvas(500, 400);
textSize(16);
columnInput = createInput();
columnInput.position(30, 40);
clearColBtn =
createButton("Clear Given Column");
clearColBtn.position(30, 70);
clearColBtn.mouseClicked(clearColumn);
// Create the table
table = new p5.Table();
// Add columns
table.addColumn("author");
table.addColumn("book");
table.addColumn("price");
table.addColumn("rating");
// Add 10 random rows to the table
for (let i = 0; i < 10; i++) {
let newRow = table.addRow();
newRow.setString("author",
"Author " + floor(random(1, 100)));
newRow.setString("book",
"Book " + floor(random(1, 100)));
newRow.setString("price",
"$" + floor(random(10, 100)));
newRow.setString("rating",
random(1, 5).toFixed(2));
}
// Display the rows currently present
getTableRows();
}
function clearColumn() {
clear();
text("Click on the button to clear "
+ "the given column in the table",
20, 20);
// Get the index of the column to be removed
let colToClear =
int(columnInput.value());
// Use the removeColumn() method to
// clear the given column of the table
if (colToClear >= 0 &&
colToClear < table.getColumnCount())
table.removeColumn(colToClear);
text("Last column cleared!", 20, 140);
getTableRows();
}
function getTableRows() {
clear();
text("Click on the button to clear "
+ "the given column in the table",
20, 20);
// Display the total columns
// present in the table
text("There are " +
table.getColumnCount() +
" columns 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);
}
输出:
在线编辑器: https://editor.p5js.org/
环境设置: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/
参考: https://p5js.org/reference/#/p5.Table/removeColumn