Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Vanilson

[Resolvido] Texto dentro de um circulo desenhado com Canvas

Por , em Desenvolvimento frontend

Recommended Posts

Vanilson    2

Vanilson
Postado

Pessoal, acho que o titulo do post já diz tudo, eu gostaria de saber como colocar texto dentro de um circulo, quadrado etc feito com canvas.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Vanilson    2

Vanilson
Postado

crf_h0m3r, valeu pela link. Resolvi o problema da seguinte forma:

function desenharcirculosletra() {
    var canvas = document.getElementById('circulo-habilidades');
    var context = canvas.getContext('2d');
    context.fillStyle = "#0099FF";
    context.beginPath();
    context.arc(62, 61, 55, 0, Math.PI*2, false);//Coordenadas X, Coordenadas Y, Raio, Inicio do ângulo, Fim do ângulo , No sentido do relógio / Contra o sentido do relógio
    context.closePath();
    context.fill();//preenche o circulo
    // Adicionar texto
    context.fillStyle = '#FFFFFF';
    context.font = '17px Trebuchet MS';
    context.fillText('Habilidades', 18, 67); 

}
<body onload="circulo-habilidades;">
 <canvas id="circulo" width="500" height="300" >

 </canvas>
</body>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito