Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Desenha barra

<canvas width="600" height="400"></canvas>

<script>

    function desenhaRetangulo(x, y, largura, altura, cor) {
        var tela = document.querySelector('canvas');
        var pincel = tela.getContext('2d');

        pincel.fillStyle=cor;
        pincel.fillRect(x,y, largura, altura);
        pincel.strokeStyle='black';
        pincel.strokeRect(x,y, largura, altura);
    }
    function desenhaTexto(x, y, texto) {
        var tela = document.querySelector('canvas');
        var pincel = tela.getContext('2d');

        pincel.font='15px Georgia';
        pincel.fillStyle='black';
        pincel.fillText(texto, x, y);    
    }
        var serie2015 = [50, 25, 20, 5];
        var serie2016 = [65, 60, 13, 2];
        var cores = ['blue', 'green', 'yellow', 'red'];

        desenhaTexto(50, 40, "Série 2015: " + " [" + serie2015 + "]"); 
        desenhaRetangulo(60, 50, 100, 50, 'blue');
        desenhaRetangulo(60, 100, 100, 25, 'green');
        desenhaRetangulo(60, 125, 100, 20, 'yellow');
        desenhaRetangulo(60, 145, 100, 5, 'red');


        desenhaTexto(350, 40, "Série 2016: " + " [" + serie2016 + "]"); 
        desenhaRetangulo(360, 50, 100, 65, 'blue');
        desenhaRetangulo(360, 115, 100, 20, 'green');
        desenhaRetangulo(360, 135, 100, 13, 'yellow');
        desenhaRetangulo(360, 148, 100, 2, 'red');       

</script> 
1 resposta
solução!

Olá, Marcos! Tudo bem por aí?

Muito bom, parabéns!

Caso tenha ficado com alguma dúvida não deixe de compartilhar com a gente.

Continue praticando, bons estudos e até mais!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software