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

function setup() { 
  createCanvas(500, 300); 
  textSize(18); 
  
  text("Enter the index of the table" + 
       " to be modified", 20, 20); 
  
  rowInput = createInput(); 
  rowInput.size(30); 
  rowInput.position(30, 40); 
  
  colInput = createInput(); 
  colInput.size(30); 
  colInput.position(80, 40); 
  
  setBtn = 
    createButton("Modify Given Row and Column"); 
  setBtn.position(30, 80); 
  setBtn.mouseClicked(modifyTableData); 
  
  // Create the table 
  table = new p5.Table(); 
  
  // Add 5 columns and rows to the table 
  for (let i = 0; i < 4; i++) { 
    table.addColumn("Column " + i); 
    table.addRow(); 
  } 
  
  setTableData(); 
} 
  
function modifyTableData() { 
    
  givenRow = int(rowInput.value()); 
  givenCol = int(colInput.value()); 
  
  if (givenRow < table.getRowCount() &&  
      givenCol < table.getColumnCount()) 
  
    // Set a number value to the given 
    // row and column 
    table.setNum(givenRow, givenCol, -999); 
  
  showTable(); 
} 
  
function setTableData() { 
  for (let r = 0; r < 4; r++) { 
    for (let c = 0; c < 4; c++) { 
  
      // Set the value at the given 
      // column and row of the table 
      table.set(r, c, r + " " + c); 
    } 
  } 
  
  showTable(); 
} 
  
function showTable() { 
  clear(); 
  text("The value is modified using" + 
       " the setNum() method", 20, 20); 
  
  // Show all the columns present 
  for (let c = 0; c < 4; c++) { 
    text(table.columns, 
         20 + 100 * c, 120); 
  } 
  
  // Show all the rows currently 
  // present in the table 
  for (let r = 0; r < 4; r++) { 
    for (let c = 0; c < 4; c++) { 
      text(table.getString(r, c), 
           20 + 100 * c, 
           140 + 20 * r); 
    } 
  } 
}