Barras aparecem escuras - problema

Boa tarde!

Estou reproduzindo o código ensinado pelo instrutor, mas todas as barras estão aparecendo escuras. O que há de errado com o código que escrevi?

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

<script>

    function desenhaRetangulo (x, y, largura, altura) {

        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 (x, y, texto);

    }


    function desenhaBarra (x, y, serie, cor, texto) {

        desenhaTexto (x, y - 10, texto);


        var somaAltura= 0;

        for (var i= 0; i < serie.length; i++) {

        var altura = serie[i];

        desenhaRetangulo (x, y + somaAltura, 50, altura, cor [i]);

        somaAltura = somaAltura + altura;



    }

}

        var cor = ['blue', 'green', 'yellow', 'red'];
        var serie2015 = [50, 25, 10, 5];
        var serie2016 = [65, 20, 13, 2];


    desenhaBarra (50, 50, serie2015, cor,'2015');
    desenhaBarra (150, 50, serie2016, cor, '2016');

</ script>

insira seu código aqui

insira seu código aqui

insira seu código aqui