p5.js是一個提供創作者可以在網頁上進行數位圖像創作的javascript套件,期望在這個密集的30天中,分享自己在使用p5.js的心得與發現。目前有鑑於NFT的熱門,使用p5.js完成的圖像,進而變成NFT市場上的交易項目,漸漸變成一個趨勢。p5.js從基本的繪圖指令到網頁媒體素材的處理,以及經由邏輯,演算法所產生的衍生圖像,更是令人不斷地想要從中發掘更多圖像的可能性。一起進入在畫布中Coding的日子吧。
網頁中表格的介面操作 今天來整理一下在p5.js中有關表格的操作 一般的表格資料,分成橫排是列 Row,直排是行 Column,每一個表格元素是 Cell,就是...
網路讀取資料的操作(JS AJAX, CORS) 今天來整理一下使用 HTTP GET,POST,DO 的資料請求通訊方式讀取資料的操作。 一般要從網路上讀取資...
網路通訊資料傳送的操作(WebSocket, OSC, MQTT) 今天來整理一下在網路通訊資料傳送中常見的3種通訊方式,WebSocket, OSC, MQT...
資料記錄與儲存的操作 今天來整理有關資料記錄與儲存的操作在網頁中有時需要記錄操作的資訊,民眾的輸入,查詢的資料等等,在p5.js中有提供一些有關儲存等功能,sa...
網頁session與cookie的記錄與儲存的操作 今天來整理有關網頁中,使用session興cookie的操作 首先先來了解一下,在網頁中,有3個儲存資料的方...
音樂檔及麥克風同時讀取音訊資料的操作 今天來整理一下,利用p5.sound.js套件,同時讀取音樂檔及麥克風音訊資料的操作 完整的程式碼整理如下HTML <...
手機麥克風音訊波形資料及錄音的操作 今天來整理利用p5.sound.js在音訊波形資料的操作一般來說,音訊除了音量大小的數值之外,就是波形的資料,分別為頻譜波形...
FileUpload 檔案上傳及縮圖處理的操作 今天來整理一下利用 input 的 type="file" 的功能操作 HTML HEAD...
網頁Canvas上傳存檔與錄影記錄的操作 今天來整理一下利用 form 元件 將canvas的圖像上傳至網站儲存 HTML <head> <...
從新開始學習p5.js畫出一片天 D01_準備好需要的工具D02_基本繪圖指令D03_Canvas畫布的密技D04_Canvas的圖像核心D05_Canvas的...