第24天：按像素绘画🎨

我们几乎在终端上做了所有事情，除了……绘图！

这正是我们今天在终端画布的帮助下要做的事情。

让我们使用例如“deno add npm：terminal-canvas”来安装它，并创建一个脚本，例如“main.ts”：

import { Canvas } from "terminal-canvas";

const canvas = Canvas.create().reset();

for (let i = 8; i < 9; i++) {
  canvas.moveTo(i, 1);
  canvas.background("green").write(" ");
}
for (let i = 6; i < 11; i++) {
  canvas.moveTo(i, 2);
  canvas.background("green").write(" ");
}
for (let i = 4; i < 13; i++) {
  canvas.moveTo(i, 3);
  canvas.background("green").write(" ");
}
for (let i = 2; i < 15; i++) {
  canvas.moveTo(i, 4);
  canvas.background("green").write(" ");
}

for (let i = 6; i < 11; i++) {
  canvas.moveTo(i, 5);
  canvas.background("green").write(" ");
}
for (let i = 4; i < 13; i++) {
  canvas.moveTo(i, 6);
  canvas.background("green").write(" ");
}
for (let i = 2; i < 15; i++) {
  canvas.moveTo(i, 7);
  canvas.background("green").write(" ");
}
for (let i = 0; i < 17; i++) {
  canvas.moveTo(i, 8);
  canvas.background("green").write(" ");
}
for (let i = 6; i < 11; i++) {
    canvas.moveTo(i, 9);
    canvas.background("brown").write(" ");
}

canvas.flush()
console.log("");
console.log("");

例如使用“deno run -A main.ts”运行并享受这棵小树：

但是树上根本没有装饰！这样不行！

我们将代码改为：

import { Canvas } from "terminal-canvas";

const canvas = Canvas.create().reset();

for (let i = 8; i < 9; i++) {
  canvas.moveTo(i, 1);
  canvas.background("green").write(" ");
}
for (let i = 6; i < 11; i++) {
  canvas.moveTo(i, 2);
  canvas.background("green").write(" ");
}
for (let i = 4; i < 13; i++) {
  canvas.moveTo(i, 3);
  canvas.background("green").write(" ");
}
for (let i = 2; i < 15; i++) {
  canvas.moveTo(i, 4);
  canvas.background("green").write(" ");
}

for (let i = 6; i < 11; i++) {
  canvas.moveTo(i, 5);
  canvas.background("green").write(" ");
}
for (let i = 4; i < 13; i++) {
  canvas.moveTo(i, 6);
  canvas.background("green").write(" ");
}
for (let i = 2; i < 15; i++) {
  canvas.moveTo(i, 7);
  canvas.background("green").write(" ");
}
for (let i = 0; i < 17; i++) {
  canvas.moveTo(i, 8);
  canvas.background("green").write(" ");
}
for (let i = 6; i < 11; i++) {
  canvas.moveTo(i, 9);
  canvas.background("brown").write(" ");
}

const colors = ["red", "cyan", "white", "yellow", "blue", "magenta"];

setInterval(() => {
  let x = Math.floor(Math.random() * colors.length);

  canvas.moveTo(2, 8);
  canvas.background(colors[x]).write(" ");
  canvas.moveTo(3, 8);
  canvas.background(colors[x]).write(" ");

  x = (x+1) % colors.length

  canvas.moveTo(5, 7);
  canvas.background(colors[x]).write(" ");
  canvas.moveTo(6, 7);
  canvas.background(colors[x]).write(" ");

  x = (x+1) % colors.length

  canvas.moveTo(11, 7);
  canvas.background(colors[x]).write(" ");
  canvas.moveTo(12, 7);
  canvas.background(colors[x]).write(" ");

  x = (x+1) % colors.length
  canvas.moveTo(8, 8);
  canvas.background(colors[x]).write(" ");
  canvas.moveTo(9, 8);
  canvas.background(colors[x]).write(" ");

  x = (x+1) % colors.length
  canvas.moveTo(13, 8);
  canvas.background(colors[x]).write(" ");
  canvas.moveTo(14, 8);
  canvas.background(colors[x]).write(" ");

  x = (x+1) % colors.length
  canvas.moveTo(8, 6);
  canvas.background(colors[x]).write(" ");
  canvas.moveTo(9, 6);
  canvas.background(colors[x]).write(" ");

  x = (x+1) % colors.length
  canvas.moveTo(9, 2);
  canvas.background(colors[x]).write(" ");
  canvas.moveTo(10, 2);
  canvas.background(colors[x]).write(" ");

  x = (x+1) % colors.length
  canvas.moveTo(5, 3);
  canvas.background(colors[x]).write(" ");
  canvas.moveTo(6, 3);
  canvas.background(colors[x]).write(" ");

  x = (x+1) % colors.length
  canvas.moveTo(11, 4);
  canvas.background(colors[x]).write(" ");
  canvas.moveTo(12, 4);
  canvas.background(colors[x]).write(" ");

  x = (x+1) % colors.length
  canvas.moveTo(6, 5);
  canvas.background(colors[x]).write(" ");
  canvas.moveTo(7, 5);
  canvas.background(colors[x]).write(" ");

  x = (x+1) % colors.length
  canvas.moveTo(8, 4);
  canvas.background(colors[x]).write(" ");
  canvas.moveTo(9, 4);
  canvas.background(colors[x]).write(" ");

  canvas.flush();
}, 40);

console.log("");
console.log("");

你喜欢看到的吗？希望你喜欢！

节日快乐！

喜欢这些内容，并且希望全年能有更多这样的内容吗？