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

Aceitável ?

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

<script>
    var serie2015 = [50, 25, 20, 5];
    var serie2016 = [65, 20, 13, 2];
    var cores = ["blue", "green", "yellow", "red"];

    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);
    }

    function desenhaBarra (x, y, serie, cores, texto) {
        if(serie == serie2015){
                desenhaRetangulo(x, y, largura=x, altura=serie2015[0], cores[0], texto);
                desenhaRetangulo(x, y+50, largura=x, altura=serie2015[1], cores[1], texto);
                desenhaRetangulo(x, y+75, largura=x, altura=serie2015[2], cores[2], texto);
                desenhaRetangulo(x, y+95, largura=x, altura=serie2015[3], cores[3], texto);
                desenhaTexto(x, y+115, texto);
            } else {
                desenhaRetangulo(x, y,largura=50, altura=serie2016[0], cores[0], texto);
                desenhaRetangulo(x, y+65, largura=50, altura=serie2016[1], cores[1], texto);
                desenhaRetangulo(x, y+85, largura=50, altura=serie2016[2], cores[2], texto);
                desenhaRetangulo(x, y+98, largura=50, altura=serie2016[3], cores[3], texto);
                desenhaTexto(x, y+115, texto);
             }
    }

    desenhaBarra (50, 50, serie2015, cores, "2015");
    desenhaBarra (150, 50, serie2016, cores, "2016");

</script>
1 resposta
solução!

Oi Matheus

Sim, está bom :)