Scale

map domain.

map domain. Enable p5.js under Libraries, wait until it is checked, then paste the whole editor.

Goal

Run every block and confirm the chart is visible.

document.body.innerHTML = "";
new p5((s) => {
  const units = [21, 15, 15, 18, 12];
  s.setup = () => { s.createCanvas(440, 220); s.noLoop(); };
  s.draw = () => {
    s.background(250);
    units.forEach((u, i) => { s.fill('#1d4f7a'); s.rect(30 + i * 80, 180 - u * 6, 50, u * 6); });
  };
});
console.log('bars');
document.body.innerHTML = "";
new p5((s) => {
  const units = [21, 15, 15, 18, 12];
  s.setup = () => { s.createCanvas(440, 220); s.noLoop(); };
  s.draw = () => {
    s.background(250);
    units.forEach((u, i) => { s.fill('#1d4f7a'); s.rect(30 + i * 80, 180 - u * 6, 50, u * 6); });
  };
});
console.log('bars');
document.body.innerHTML = "";
new p5((s) => {
  const mm = [48, 55, 92, 150];
  s.setup = () => { s.createCanvas(420, 200); s.noLoop(); };
  s.draw = () => { s.background(250); s.noFill(); s.stroke("#1d4f7a"); s.beginShape(); mm.forEach((v, i) => s.vertex(40 + i * 100, s.map(v, 0, 160, 180, 20))); s.endShape(); };
});
console.log("line");
console.log('scale');