function
setup() {
createCanvas(500, 300);
textSize(18);
text(
"Click the button to modify the table"
,
20, 20);
setBtn =
createButton(
"Change Status"
);
setBtn.position(30, 60);
setBtn.mouseClicked(modifyTableData);
table =
new
p5.Table();
table.addColumn(
"destination"
);
table.addColumn(
"visited"
);
let row = table.addRow();
row.setString(
"destination"
,
"Japan"
);
row.setString(
"visited"
,
"Yes"
);
row = table.addRow();
row.setString(
"destination"
,
"Malaysia"
);
row.setString(
"visited"
,
"No"
);
row = table.addRow();
row.setString(
"destination"
,
"Switzerland"
);
row.setString(
"visited"
,
"No"
);
row = table.addRow();
row.setString(
"destination"
,
"Venice"
);
row.setString(
"visited"
,
"No"
);
showTable();
}
function
modifyTableData() {
for
(let r = 0; r < table.getRowCount(); r++) {
let tableRow = table.rows[r];
if
(tableRow.getString(
"visited"
) ==
"No"
)
tableRow.setString(
"visited"
,
"Yes"
);
}
showTable();
}
function
showTable() {
clear();
text(
"The value is modified using the "
+
"setString() method"
, 20, 20);
for
(let c = 0; c < 2; c++) {
text(table.columns, 20 + 160 * c, 110);
}
for
(let r = 0; r < table.getRowCount(); r++) {
for
(let c = 0; c < 2; c++) {
text(table.getString(r, c),
20 + 160 * c, 140 + 20 * r);
}
}
}