Boa noite.
Como eu consigo escrever uma string dentro do canvas?
Não estou conseguindo, alguém pode me ajudar, por favor.
Segue abaixo print do canvas criado, preciso apenas de escrever uma string..
Boa noite.
Como eu consigo escrever uma string dentro do canvas?
Não estou conseguindo, alguém pode me ajudar, por favor.
Segue abaixo print do canvas criado, preciso apenas de escrever uma string..
Como não foi informado o código acima (canvas) eu criei uma com uma bandeira da itália, e coloquei uma string por lá mesmo (centro).
Segue abaixo um exemplo de colocar uma string dentro do canvas:
const canvas = document.getElementById("myCanvas");
const context = canvas.getContext("2d");
const width = canvas.width;
const height = canvas.height; // Desenha a faixa verde
context.fillStyle = "#009246";
context.fillRect(0, 0, width / 3, height); // Desenha a faixa branca com sombreamento
const whiteGradient = context.createLinearGradient(width / 3, 0, 2 * width / 3, 0);
whiteGradient.addColorStop(0, "#FFFFFF");
whiteGradient.addColorStop(0.5, "rgba(255, 255, 255, 0.5)");
whiteGradient.addColorStop(1, "#FFFFFF");
context.fillStyle = whiteGradient;
context.fillRect(width / 3, 0, width / 3, height); // Desenha a faixa vermelha
context.fillStyle = "#CE2B37";
context.fillRect(2 * width / 3, 0, width / 3, height); // Adiciona texto
context.fillStyle = "red";
context.font = "bold 30px Arial";
context.textAlign = "center";
context.fillText("ITÁLIA", width / 2, height / 2);width / 2: É a coordenada X do ponto em que o texto será desenhado no canvas. Usamos a metade da largura do canvas (width) para centralizar o texto horizontalmente.
height / 2: É a coordenada Y do ponto em que o texto será desenhado no canvas. Usamos a metade da altura do canvas (height) para centralizar o texto verticalmente.