p5js怎么导入html,p5.js loadTable()用法及代码示例
loadTable()函数用于读取文件或URL的内容并从中创建p5.Table对象。 options参数可用于定义期望读取数据的格式类型。所有加载和保存的文件均采用UTF-8编码。
该函数是异步的,因此建议在preload()函数中调用该函数,以确保该函数先于其他函数执行。
用法:
loadTable(filename, options, [callback], [errorCallback])
或者
loadTable(filename, [callback], [errorCallback])
参数:该函数接受上面提到和下面描述的四个参数。
filename:这是一个字符串,表示必须从中加载数据的文件路径或URL。
options:它是一个字符串,表示要加载的文件的格式。可以是“csv”(使用逗号分隔值加载表),也可以是“tsv”(使用制表符分隔值加载表)。还可以指定值“header”来表示表是否具有标题值。通过将它们作为单独的参数传递,可以使用多个命令。它是一个可选参数。
callback:当该函数成功执行时,将调用此函数。此函数的第一个参数是从文件加载的XML数据。它是一个可选参数。
errorCallback:如果执行该函数时有任何错误,则调用该函数。此函数的第一个参数是错误响应。它是一个可选参数。
以下示例说明了p5.js中的loadTable()函数:
范例1:
// Contents of books.csv
// Book One, Author One, Price One
// Book Two, Author Two, Price Two
// Book Three, Author Three, Price Three
let loadedTable = null;
function setup() {
createCanvas(500, 300);
textSize(18);
text("Click on the button below to"+
" load Table from file", 20, 20);
// Create a button for loading the table
loadBtn = createButton("Load Table from file");
loadBtn.position(30, 50)
loadBtn.mousePressed(loadFile);
}
function loadFile() {
// Load the table from file
loadedTable = loadTable('books.csv', 'csv', onFileload);
}
function onFileload() {
text("Table loaded successfully...", 20, 100);
// Display through the table
for (let r = 0; r < loadedTable.getRowCount(); r++) {
for (let c = 0; c < loadedTable.getColumnCount(); c++) {
text(loadedTable.getString(r, c),
20 + c * 200, 150 + r * 20);
}
}
}
输出:
范例2:
// Contents of books_header.csv
// title, author, price
// Book One, Author One, Price One
// Book Two, Author Two, Price Two
// Book Three, Author Three, Price Three
let loadedTable = null;
function setup() {
createCanvas(500, 300);
textSize(22);
text("Click on the button below to "
+ "load Table from file", 20, 20);
// Create a button for loading the table
loadBtn = createButton("Load Table from file");
loadBtn.position(30, 50)
loadBtn.mousePressed(loadFile);
}
function loadFile() {
// Load the table from file with headers
loadedTable = loadTable('books_header.csv',
'csv', 'header', onFileload);
}
function onFileload() {
text("Table loaded successfully...", 20, 100);
// Display the headers
for (let h = 0; h < loadedTable.getColumnCount(); h++) {
text(loadedTable.columns[h], 20 + h * 200, 150);
}
textSize(16);
// Display the data in the table
for (let r = 0; r < loadedTable.getRowCount(); r++) {
for (let c = 0; c < loadedTable.getColumnCount(); c++) {
text(loadedTable.getString(r, c),
20 + c * 200, 170 + r * 20);
}
}
}
输出:
p5js怎么导入html,p5.js loadTable()用法及代码示例相关推荐
- python numpy allclose用法及代码示例
python numpy allclose用法及代码示例 用法: numpy.allclose(a, b, rtol=1e-05, atol=1e-08, equal_nan=False) 如果两个数 ...
- PostgreSQL REGEXP_REPLACE用法及代码示例
PostgreSQL REGEXP_REPLACE用法及代码示例: 原文链接:https://vimsky.com/examples/usage/postgresql-regexp_replace-f ...
- html焦点试图代码,HTML DOM focus()用法及代码示例
DOM focus()方法用于为元素赋予焦点,并借助blur()方法删除焦点.我们可以将焦点放在任何元素上,并通过执行一些操作来启用它.例如,我们可以通过单击按钮将焦点放在某些文本上. 用法: Obj ...
- java中skip的用法,Java PushbackReader skip(long)用法及代码示例
Java中的PushbackReader类的skip(long)方法用于跳过流中指定数量的字符.此字符数被指定为参数.如果通过跳过到达流的末尾,它将阻塞流,直到它获得一些字符或抛出IOExceptio ...
- reset java_Java PushbackReader reset()用法及代码示例
Java中的PushbackReader类的reset()方法用于重置Stream.对于PushbackReader,此方法始终会引发异常,因为PushbackReader不支持此方法. 用法: pu ...
- html里fill怎么自定义,HTML canvas fill()用法及代码示例
画布fill()方法用于填充当前绘图路径.画布fill()方法的默认颜色是黑色. 用法: context.fill() 示例1: HTML canvas fillRect() Method width ...
- JS短信接口代码示例
这篇文章主要为大家分享JS短信接口代码,JS短信发送.JS批量发送.JS短信验证码发送,感兴趣的小伙伴们可以参考一下. 支持语言:JS 功能:JS短信接口.JS发送短信 用途:短信验证码.会员营销短信 ...
- java println 用法_Java PrintWriter println()用法及代码示例
Java中的PrintWriter类的println()方法用于中断流中的行.此方法不接受任何参数或返回任何值. 用法: public void println() 参数:此方法不接受任何参数. 返回 ...
- html dom的nodetype值介绍,HTML DOM nodeType用法及代码示例
DOM nodeType属性用于查找我们要引用的节点的类型.特定节点的类型以数字形式返回. DOM nodeType属性是一个只读属性. 返回值:它根据节点的类型返回一个数值. 1:如果node是元素 ...
最新文章
- 这届留学生太惨!美国高校不复课,特朗普政府却要断他们签证;吴恩达:糟糕透顶...
- 安装linux办公软件,Centos7如何安装开源办公软件Libreoffice
- [ActionScript 3.0] AS3.0 简单封装Socket的通信
- git设置忽略文件和目录
- python 稀疏数组搜索
- OpenCV删除面积小的区域 实现图像二值化分割 标记连通区域
- 瀑布流布局JavaScript实现
- matlab怎么调整子图间距,matplotlib调整子图间距,调整整体空白的方法
- android ota更新app,企业 OTA 更新 | Android 开源项目 | Android Open Source Project
- .NET Core 2.1中的HttpClientFactory最佳实践
- 【分布计算环境学习笔记】2 分布式系统中的面向对象技术
- 计算机网络工程概论论文,网络工程专业导论论文提纲格式模板 网络工程专业导论论文框架怎么写...
- 如何将html转换成url,HTML URL
- 【北京迅为】i.MX6ULL终结者硬件资源说明
- Flask框架四:模板继承以及豆瓣案例
- 计算机术语横幅迎新,内蒙古师范大学用代码写迎新条幅,还有哪些搞笑的迎新标语?...
- H5,js实现tom猫动态的简单APP
- 腾讯的野望:一个游戏公司怎么拯救世界?
- 一图全解芯片制造的全过程
- php实现团购功能,PHP 对接美团大众点评团购券(门票)的开发步骤