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

p5.js中p5.Table的getString()方法用於從表的給定行和列中檢索String值。可以通過行ID來指定行，並且可以通過其列ID或列名來指定列。

用法:

getString( row, column )

參數：此方法接受上麵提到和下麵描述的兩個參數：

row:該數字表示行的行ID。
column:它是一個字符串或數字，表示列的名稱或列的ID。

返回值：此方法返回一個String，它是從表的給定行和列中檢索到的值。

以下示例說明了p5.js中的getString()方法：

範例1：

Javascript

function setup() { 
  createCanvas(600, 300); 
  textSize(18); 
  
  text("Click on the button to get all " + 
  "string values of the table", 20, 20); 
  
  setBtn = 
    createButton("Get all table values"); 
  setBtn.position(30, 40); 
  setBtn.mouseClicked(showTable); 
  
  // Create the table 
  table = new p5.Table(); 
  
  setTableData(); 
} 
  
function setTableData() { 
  table.addColumn('Waterfall'); 
  table.addColumn('Height'); 
  
  let tableRow = table.addRow(); 
  tableRow.setString('Waterfall', 
                     'Angel Falls'); 
  tableRow.setString('Height', 
                     '979 metres'); 
  
  tableRow = table.addRow(); 
  tableRow.setString('Waterfall', 'Tugela Falls'); 
  tableRow.setString('Height', '948 metres'); 
  
  tableRow = table.addRow(); 
  tableRow.setString('Waterfall', 'Tres Hermanas Falls'); 
  tableRow.setString('Height', '914 metres'); 
} 
  
function showTable() { 
  clear(); 
  text("The values of the table are retrieved " + 
  "using the getString() method", 20, 20); 
  
  // Show all the columns present 
  for (let c = 0; c < table.getColumnCount(); c++) { 
    text(table.columns, 20 + 200 * c, 80); 
  } 
  
  // 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++) { 
  
      // Get the string at the given row and column 
      text(table.getString(r, c), 
           20 + 200 * c, 
           110 + 20 * r); 
    } 
  } 
}

輸出：

範例2：

Javascript

function setup() { 
  createCanvas(600, 300); 
  textSize(18); 
  
  text("Click on the button to get the " + 
       "specific string value of the table", 
       20, 20); 
  
  text("Enter row and column", 20, 60); 
  
  rowInp = createInput(); 
  rowInp.position(30, 80); 
  rowInp.size(30, 20); 
  
  colInp = createInput(); 
  colInp.position(70, 80); 
  colInp.size(30, 20); 
  
  setBtn = 
    createButton("Get value at row and column"); 
  setBtn.position(30, 110); 
  setBtn.mouseClicked(getValueAt); 
  
  // Create the table 
  table = new p5.Table(); 
  
  setTableData() 
} 
  
function setTableData() { 
  
  table.addColumn('Waterfall'); 
  table.addColumn('Height'); 
  
  let tableRow = table.addRow(); 
  tableRow.setString('Waterfall', 'Angel Falls'); 
  tableRow.setString('Height', '979 metres'); 
  
  tableRow = table.addRow(); 
  tableRow.setString('Waterfall', 'Tugela Falls'); 
  tableRow.setString('Height', '948 metres'); 
  
  tableRow = table.addRow(); 
  tableRow.setString('Waterfall', 'Tres Hermanas Falls'); 
  tableRow.setString('Height', '914 metres'); 
  
} 
  
function getValueAt() { 
  clear(); 
  let rowToGet = int(rowInp.value()); 
  let colToGet = int(colInp.value()); 
  
  if (rowToGet < table.getRowCount() && 
      colToGet < table.getColumnCount()) { 
    text("The value at row " + rowToGet + 
         " and column " + colToGet + " is:", 
         20, 160); 
  
    // Get the string at the given row and column 
    text(table.getString(rowToGet, colToGet), 
         20, 180); 
  } 
  else
    text("Please enter correct row and " + 
         "column values", 20, 160); 
  
  
  text("Click on the button to get the " + 
       "specific string value of the table", 
       20, 20); 
  text("Enter row and column", 20, 60); 
}

輸出：

在線編輯： https://editor.p5js.org/

環境設置： https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/

參考： https://p5js.org/reference/#/p5.Table/getString

相關用法

注：本文由純淨天空篩選整理自sayantanm19大神的英文原創作品 p5.Table getString() Method。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。