Data-Pixels通過(guò)編程創(chuàng)造像素圖案

DATA PIXELS 是一款通過(guò)編程來(lái)畫像素圖的工具，包含 DataPixels.js 和?Data Pixels Playground 兩部分。

DataPixels.js

DataPixels.js 源代碼采用模塊化 ES2015 類設(shè)計(jì)，可輕松構(gòu)建新實(shí)例，每個(gè)實(shí)例都包含?HTMLCanvasElement?和?HTMLImageElement?公共訪問(wèn)器，在運(yùn)行時(shí)通過(guò)編程生成像素圖像。

安裝

通過(guò)輸入以下 CLI 命令，可以將 DataPixels.js 包作為項(xiàng)目依賴項(xiàng)從 NPM 安裝：

npm i data-pixels

創(chuàng)建

DataPixels.js 構(gòu)造函數(shù)需要 2 個(gè)參數(shù)：

1. pixelData：包含一個(gè)或多個(gè)等長(zhǎng)數(shù)組的數(shù)組，由每個(gè) 24 位 RGB 顏色通道（例如“255, 255, 255”）或 32 位 RGBA 顏色通道（例如“255, 255, 255, 255”）的 0-255 個(gè)整數(shù)值組成的字符串組成。此外，字符串可以可選地包含任何類型的描述性文本（例如，“Red: 255, G - 128, 64 for Blue, Transparency = 32”），因?yàn)樽址械臄?shù)字值將按 RGB / RGBA 順序進(jìn)行解析。包含 4 個(gè)以上數(shù)字的字符串將引發(fā)錯(cuò)誤。

2. pixelSize：每個(gè)顏色數(shù)據(jù)單元的大?。ㄒ韵袼貫閱挝唬?。該值表示形成像素藝術(shù)的每個(gè)感知像素的大小。

Data Pixels Playground

Data Pixels Playground 是適用于?Windows、Mac?和?Linux?的輕量級(jí)跨平臺(tái)桌面應(yīng)用程序，可用于編寫和執(zhí)行 DataPixels.js 實(shí)例，便于及時(shí)查看或修改 DataPixels.js 生成的圖案。