p5.js Table getColumnCount()用法及代碼示例

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); 
  
  // Create the table 
  table = new p5.Table(); 
  
  // Add columns 
  table.addColumn("Column 1"); 
  table.addColumn("Column 2"); 
  
  // Display the table 
  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); 
  
  // Get the number of columns 
  // currently in the table 
  let columnCount = table.getColumnCount(); 
  
  // Display the total columns 
  // present in the table 
  text("There are " + columnCount +  
       " columns in the table", 
       20, 100); 
  
  // Show all the column names 
  // currently present in the table 
  for (let c = 0; c < columnCount; c++) 
    text(table.columns, 30, 140 + c * 20); 
}