Grafico de barras

<meta charset="UTF-8">

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

<script>

    /*Funcion que sirve para dibujar rectangulos*/
    function dibujarRectangulo(x, y, base, altura, color){

        //Asigamos en esta variable la etiqueta canvas para posteriormente acceder asus propiedades
        var lienzo = document.querySelector("canvas");
        //Aquí obtenemos el contexto (entorno) de nuestro canvas para poder dibujar en el 
        var pincel = lienzo.getContext("2d");
        //Asignamos el color de cada rectandulo
        pincel.fillStyle = color;
        //dibujamos el rectangulo con los parametros obtenidos de la función
        pincel.fillRect(x,y,base,altura);
        //Se le asigna el color del borde de nuestro rectangulo
        pincel.strokeStyle="black";
        //Pintamos los bordes sobre nuestro rectangulo
        pincel.strokeRect(x,y,base,altura);

    }
    /*Funcion que sirve para hacer textos*/
    function escribirTexto(x, y, texto){

        var lienzo = document.querySelector("canvas");
        var pincel = lienzo.getContext("2d");

        //Se le asigna el tamaño y el tipo de letra de nuestro texto
        pincel.font = "15px Georgia";
        //Se le asigna el color de la letra de nuestro texto
        pincel.fillStyle = "black";
        //Se le asigna la posición de nuestro texto (ubicación)
        pincel.fillText(texto,x,y);

    }

    var agno2009 = [6, 47, 41, 3, 3];
    var agno2019 = [81, 9, 3, 3, 4];

    var colores = ["blue", "green", "yellow", "red", "gray"];

    /*Función que sirve para dibujar nuestro grafico de barras*/
    function dibujarBarra(x, y, agnoArray, colores, texto){

        //Función que sirve para implementar un tirulo sobre nuestro grafico de barras
        escribirTexto(x+4,y-5, texto);

        /*Operador ternario en donde comparamos el valor de x, si (x>50), entonces le 
        asignamos el valor de 50, para que el ancho de nuestra grafica sea homogenea a las demas*/
        var ancho = x > 50 ? 50 : 50;

        //Ciclo donde iteramos sobre nuestos arreglos y dibujamos nuestros resctangulos
        for(var i=0; i<agnoArray.length; i++){

            //Función que nos ayuda a dibujar nuestro rectangulos
           dibujarRectangulo(x, y, ancho, agnoArray[i], colores[i]);
           //Operador de incremento en donde se suman los valores de y, para obtener la posicion de nuestros rectangulos
           y+=agnoArray[i];
        }
    }
    //Llamada de nuestra función dibujarBarra
    dibujarBarra(50, 50, agno2009, colores, "2009");

    dibujarBarra(150,50, agno2019, colores,"2019");

</script>