https://editor.p5js.org/illus0r/sketches/NHBATASC7
Начинаем с такого кода:
let str = 'Helloworld'
let myFont
let da = 0
function preload() {
myFont = loadFont('MajorMonoDisplay-Regular.ttf')
}
function setup() {
createCanvas(400, 400)
textAlign(CENTER, CENTER)
textSize(100)
// frameRate(1)
textFont(myFont)
background(0)
fill(255)
}
function draw() {
background(0, 10)
for (let i = 0; i < str.length; i++) {
let a = i * 2 * PI / str.length
let x = width / 2 + 150 * sin(a)
let y = height / 2 + 150 * -cos(a)
text(str[i], x, y - 10)
}
}
let str = 'loremipsumdolorametset'
let myFont
let da = 0
function preload() {
myFont = loadFont('MajorMonoDisplay-Regular.ttf')
}
function setup() {
createCanvas(400, 400)
textAlign(CENTER, CENTER)
textSize(40)
textFont(myFont)
background(0)
fill(255)
}
function draw() {
background(0, 70)
da += (sin(frameCount * .1) * .4 + .6) * .01
for (let i = 0; i < str.length; i++) {
push()
let x = 100 + 50 * (i % 5)
let y = 100 + floor(i / 5) * 50
translate(x, y)
rotate(-atan2(x - mouseX, y - mouseY))
text(str[i], 0, -10)
pop()
}
}
let str = 'helloworldhelloworldhelloworld'
let myFont
let da = 0
function preload() {
myFont = loadFont('MajorMonoDisplay-Regular.ttf')
}
function setup() {
createCanvas(400, 400)
textAlign(CENTER, CENTER)
textSize(40)
// frameRate(1)
textFont(myFont)
background(0)
fill(255)
}
function draw() {
background(0, 10)
for (let i = 0; i < str.length; i++) {
let x = 100 + (i % 5) * 40
let y = 100 + floor(i / 5) * 40
text(str[i], x, y - 10)
}
}
let str = 'helloworldhelloworldhelloworld'
let myFont
let da = 0
function preload() {
myFont = loadFont('MajorMonoDisplay-Regular.ttf')
}
function setup() {
createCanvas(400, 400)
textAlign(CENTER, CENTER)
textSize(40)
textFont(myFont)
background(0)
fill(255)
}
function draw() {
background(0, 10)
for (let i = 0; i < str.length; i++) {
push()
let x = 100 + (i % 5) * 40
let y = 100 + floor(i / 5) * 40
translate(x, y)
text(str[i], 0, -10)
pop()
}
}
let str = 'helloworldhelloworldhelloworld'
let myFont
let da = 0
function preload() {
myFont = loadFont('MajorMonoDisplay-Regular.ttf')
}
function setup() {
createCanvas(400, 400)
textAlign(CENTER, CENTER)
textSize(40)
textFont(myFont)
background(0)
fill(255)
}
function draw() {
background(0, 50)
for (let i = 0; i < str.length; i++) {
push()
let x = 100 + (i % 5) * 40
let y = 100 + floor(i / 5) * 40
let a = -atan2(x-mouseX,y-mouseY)
translate(x, y)
rotate(a)
text(str[i], 0, -10)
pop()
}
}
https://www.instagram.com/p/CEci4Hfhjhx/
let str = 'helloworldhelloworldhelloworld'
let myFont
let da = 0
function preload() {
myFont = loadFont('MajorMonoDisplay-Regular.ttf')
}
function setup() {
createCanvas(400, 400)
textAlign(CENTER, CENTER)
textSize(40)
textFont(myFont)
background(0)
fill(255)
}
function draw() {
background(0, 50)
for (let i = 0; i < str.length; i++) {
push()
let x = 100 + (i % 5) * 40
let y = 100 + floor(i / 5) * 40
let dx = x-mouseX
let dy = y-mouseY
let a = atan2(dx,dy)
const R = 100
function f(d, R){
return (d/R)**.25 * R
}
let d = Math.sqrt(dx**2+dy**2)
if(d < R){
x = mouseX + f(d, R) * sin(a)
y = mouseY + f(d, R) * cos(a)
}
translate(x, y)
// rotate(a)
text(str[i], 0, -10)
pop()
}
}