In New Zealand being kid of human.
We might make mistakes but we will make other things too. -
Michael Joseph Savage
p5(sketch => {
let pad =0
let padH =0
let wordWidth = 0
let font = 0
let fontSize = 32 // font height
let fSize = 0
let ww=width;
let wh=width;
sketch.preload = function() {
font = sketch.loadFont(localfont);
}
sketch.setup = function() {
sketch.noLoop();
sketch.textFont(font);
sketch.textSize(fontSize);
// sketch.textAlign(sketch.CENTER)
sketch.createCanvas(ww, wh);
// loop over font size until wordWidth is close to width
for(let fs=fontSize; fs<ww-(ww*0.05); fs++){
wordWidth = font.textBounds(words, 0, 0, fs);
if(wordWidth.w > ww-24){
fontSize=fs;
break;
}
}
pad = sketch.floor(ww-wordWidth.w-(24/2))/2
};
sketch.draw = function() {
sketch.background(sketch.color('#81d8d0'));
for (let i=1;i < 100;i++){ // math is hard, so didn't work out the formual for word length to window height, plus is slows down badly after 200
fSize = fontSize*(1/i);
padH+=fSize;
sketch.textSize(fSize);
sketch.text(words.repeat(i), pad, padH);
}
}
})
localfont = FileAttachment("SourceCodePro-Black.ttf").url()
import {p5, ParticleSystem} from "@tmcw/p5"
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
