

在 P5.js 中实现的文字分散效果。
实现方式:将画布分为若干个 tile,然后对每个 tile 中文字的位置按正弦函数进行偏移。


核心代码:
for (let y = 0; y < tile; y++) {
for (let x = 0; x < tile; x++) {
// sine function
const offsetX = sin(frameCount * 0.0025 * (x * y)) * 30
// source position
const sx = floor(x * tileW + offsetX)
const sy = floor(y * tileH)
const sw = tileW
const sh = tileH
// dest position
const dx = floor(x * tileW)
const dy = floor(y * tileH)
const dw = tileW
const dh = tileH
copy(pg, sx, sy, sw, sh, dx, dy, dw, dh)
}
}