let colCount = 3;
function
setup() {
createCanvas(500, 400);
textSize(16);
addColBtn = createButton(
"Add Column"
);
addColBtn.position(30, 50);
addColBtn.mouseClicked(addOneColumn);
removeColBtn =
createButton(
"Clear Last Column"
);
removeColBtn.position(160, 50);
removeColBtn.mouseClicked(clearLastColumn);
table =
new
p5.Table();
table.addColumn(
"Column 1"
);
table.addColumn(
"Column 2"
);
showTable();
}
function
clearLastColumn() {
let lastColumn =
table.getColumnCount() - 1;
if
(lastColumn >= 0)
table.removeColumn(lastColumn);
showTable();
}
function
addOneColumn() {
table.addColumn(
"Column "
+ colCount);
colCount++;
showTable();
}
function
showTable() {
clear();
text(
"Click on the buttons to change"
+
" the number of columns in the table"
,
20, 20);
let columnCount = table.getColumnCount();
text(
"There are "
+ columnCount +
" columns in the table"
,
20, 100);
for
(let c = 0; c < columnCount; c++)
text(table.columns, 30, 140 + c * 20);
}