p5.Table trim() Method

The trim() method of p5.Table in p5.js is used to remove leading and trailing whitespaces from the table values that are a String. The whitespaces include spaces or tabs that may be present in the string. A specific column may be specified for removing whitespaces from that column only. However, if no column is specified then the values in all the columns and rows are trimmed.

Syntax:

trim( [column] )

Parameters: This function accepts a single parameter as mentioned above and described below:

• column: It is a String or integer that specifies the column name or ID of the column to be trimmed. It is an optional parameter.

The example below illustrates the trim() method in p5.js:

Example 1:

function setup() {
  createCanvas(500, 300);
  textSize(16);

  trimBtn =
    createButton("Trim the table");
  trimBtn.position(30, 40);
  trimBtn.mouseClicked(trimTable);

  // Create the table
  table = new p5.Table();

  // Add two columns
  table.addColumn("name");
  table.addColumn("rating");

  // Add some rows to the table
  let newRow = table.addRow();
  newRow.setString("name", "Eren      ");
  newRow.setString("rating", "  Good");

  newRow = table.addRow();
  newRow.setString("name", "   Erwin");
  newRow.setString("rating", "Excellent     ");

  newRow = table.addRow();
  newRow.setString("name", "Marco");
  newRow.setString("rating", "     OK");

  newRow = table.addRow();
  newRow.setString("name", "        Mikasa        ");
  newRow.setString("rating", "Very    Good  ");

  showTable();
}

function trimTable() {
  // Trim all the columns and rows
  table.trim();

  // Redraw the table
  showTable();
}

function showTable() {
  clear();

  // Display the rows 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 + c * 140,
           100 + r * 20);

  text("Click on the button to trim the table",
       20, 20);
}

Output:

Example 2:

function setup() {
  createCanvas(500, 300);
  textSize(16);

  trimBtn =
    createButton("Trim the table");
  trimBtn.position(30, 40);
  trimBtn.mouseClicked(trimTable);

  // Create the table
  table = new p5.Table();

  // Add two columns
  table.addColumn("name");
  table.addColumn("rating");

  // Add some rows to the table
  let newRow = table.addRow();
  newRow.setString("name", "Eren      ");
  newRow.setString("rating", "  Good");

  newRow = table.addRow();
  newRow.setString("name", "   Erwin");
  newRow.setString("rating", "Excellent     ");

  newRow = table.addRow();
  newRow.setString("name", "Marco");
  newRow.setString("rating", "     OK");

  newRow = table.addRow();
  newRow.setString("name", "        Mikasa        ");
  newRow.setString("rating", "Very    Good  ");

  showTable();
}

function trimTable() {
  // Trim only the 'name' column
  table.trim('name');

  // Redraw the table
  showTable();
}

function showTable() {
  clear();

  // Display the rows 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 + c * 140, 100 + r * 20);

  text("Click on the button to trim the table",
       20, 20);
}

Output:

Online editor: https://editor.p5js.org/

Environment Setup: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/

Reference: https://p5js.org/reference/#/p5.Table/trim