当前位置: 首页>>代码示例 >>用法及示例精选 >>正文


p5.js Table addColumn()用法及代码示例


p5.j​​s中p5.Table的addColumn()方法用于向表对象添加新列。该方法接受单个参数,该参数用于指定列的标题,以便以后可以轻松引用。这是一个可选值,如果未指定标题,则新列的标题将保留为空。语法:

addColumn( [title] )

参数:该函数接受如上所述和以下描述的单个参数:

  • title:它是一个字符串,表示新列的标题。它是一个可选参数。

以下示例说明了p5.js中的addColumn()函数:示例1:

javascript

function setup() { 
  createCanvas(500, 300); 
  textSize(16); 
  
  saveTableBtn = createButton("Save Table"); 
  saveTableBtn.position(30, 50); 
  saveTableBtn.mouseClicked(saveToFile); 
  
  text("Click on the button to save table to csv", 20, 20); 
    
  // Create the table 
  table = new p5.Table(); 
  
  // Add two columns 
  // using addColumn() 
  table.addColumn("author"); 
  table.addColumn("language"); 
  
  // Add two rows 
  let newRow = table.addRow(); 
  newRow.setString("author", "Dennis Ritchie"); 
  newRow.setString("language", "C"); 
  
  newRow = table.addRow(); 
  newRow.setString("author", "Bjarne Stroustrup"); 
  newRow.setString("language", "C++"); 
  
  text("The table has " + table.getColumnCount() +  
       " columns", 20, 100); 
} 
  
function saveToFile() { 
  saveTable(table, "saved_table.csv"); 
}

输出:



addCol-saveFile

范例2:

javascript

function setup() { 
  createCanvas(600, 300); 
  textSize(16); 
  
  addColBnt = createButton("Add Column"); 
  addColBnt.position(30, 20); 
  addColBnt.mouseClicked(addNewCol); 
  
  // Create the table 
  table = new p5.Table(); 
} 
  
function addNewCol() { 
  let colName = "Random Column " + floor(random(1, 100)); 
  
  // Add the given column to table 
  table.addColumn(colName); 
} 
  
function draw() { 
  clear(); 
  
  // Show the total number of columns 
  // and current column names 
  text("The table has " + table.getColumnCount() +  
       " columns", 20, 60); 
  text("The columns are", 20, 80); 
  for (let i = 0; i < table.columns.length; i++) { 
    text(table.columns[i], 20, 100 + i * 20); 
  } 
}

输出:

addCol-btn

在线编辑: https://editor.p5js.org/
环境设置: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/
参考: https://p5js.org/reference/#/p5.Table/addColumn




相关用法


注:本文由纯净天空筛选整理自sayantanm19大神的英文原创作品 p5.js | p5.Table addColumn() Method。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。