Barra de gráficos

Dei uma olhada nos códigos de outras pessoas e ficou um pouco diferente, mas deu certo!

<canvas width="600" height="400"></canvas>
<script type="text/javascript">
    var tela = document.querySelector("canvas");
    var pincel = tela.getContext("2d");

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

    function desenharRetangulo(x,y,largura,altura,cor){
        pincel.fillStyle = cor;
        pincel.fillRect(x,y,largura,altura);

        pincel.strokeStyle = cor;
        pincel.strokeRect(x,y,largura,altura);
    }

    function desenharTexto(texto,x,y){
        pincel.font = "20px Cursive";
        pincel.fillStyle = "black";
        pincel.fillText(texto, x, y);
    }

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

        for(c = 0; c < serie.length; c++){
            desenharRetangulo(x,y,45,serie[c],cor[c]);
            y = y + (serie[c]);
        }

        desenharTexto(texto,x,y+30);


    };

    desenharBarra(100,100,serie2015,cores,"2015");
    desenharBarra(200,100,serie2016,cores,"2016");







</script>