El método setString() de p5.Table en p5.js se usa para almacenar el valor de string dado en la fila y columna dadas de la tabla. La fila se puede especificar por el Id. de fila y la columna se puede especificar por su Id. de columna o nombre de columna.
Sintaxis:
setString( row, column, value )
Parámetros: esta función acepta tres parámetros, como se mencionó anteriormente y se describe a continuación:
- fila: Es un Número que denota el ID de fila de la fila.
- columna: Es una String o Número que denota el nombre de la columna o ID de la columna.
- value: Es un String que especifica el valor que se tiene que almacenar.
Los siguientes ejemplos ilustran el método setString() en p5.js:
Ejemplo 1:
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); // Create the table table = new p5.Table(); // Add the columns and rows table.addColumn("flight"); table.addColumn("status"); let row = table.addRow(); row.setString("flight", "American Air"); row.setString("status", "On Time"); row = table.addRow(); row.setString("flight", "Lufthansa"); row.setString("status", "On Time"); row = table.addRow(); row.setString("flight", "United Air"); row.setString("status", "Delayed"); showTable(); } function modifyTableData() { // Loop through all the rows // in the table for (let r = 0; r < table.getRowCount(); r++) { // Change the string of the status column if (table.getString(r, "status") == "On Time") table.setString(r, "status", "Delayed"); else table.setString(r, "status", "On Time"); } showTable(); } function showTable() { clear(); text("The value is modified using the" + " setString() method", 20, 20); // Show all the columns present for (let c = 0; c < 2; c++) { text(table.columns, 20 + 160 * c, 110); } // Show all the rows currently // present in the table for (let r = 0; r < 3; r++) { for (let c = 0; c < 2; c++) { text(table.getString(r, c), 20 + 160 * c, 140 + 20 * r); } } }
Producción:
Ejemplo 2:
function setup() { createCanvas(500, 300); textSize(18); setBtn = createButton("Toggle Strings"); setBtn.position(30, 40); setBtn.mouseClicked(modifyTableData); // Create the table table = new p5.Table(); for (let i = 0; i < 10; i++) { table.addColumn(); table.addRow(); } createTable(); } function createTable() { // Loop through all the rows and columns // in the table and set their initial // string values for (let r = 0; r < table.getRowCount(); r++) { for (let c = 0; c < table.getColumnCount(); c++) { if ((r + c) % 2 == 0) table.setString(r, c, "X"); else table.setString(r, c, "O"); } } showTable(); } function modifyTableData() { // Loop through all the rows and columns // in the table and change their values // depending on the previous string for (let r = 0; r < table.getRowCount(); r++) { for (let c = 0; c < table.getColumnCount(); c++) { if (table.getString(r, c) == "X") table.setString(r, c, "O"); else table.setString(r, c, "X"); } } showTable(); } function showTable() { clear(); text("The value is modified using the" + " setString() method", 20, 20); // Show all the rows currently // present in the table for (let r = 0; r < table.getRowCount(); r++) { for (let c = 0; c < table.getColumnCount(); c++) { text(table.getString(r, c), 20 + 40 * c, 80 + 20 * r); } } }
Producción:
Editor en línea: https://editor.p5js.org/
Configuración del entorno: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/
Referencia: https://p5js.org/reference/#/p5.Table/setString
Publicación traducida automáticamente
Artículo escrito por sayantanm19 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA