Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
1
respuesta

Comparto mi solución

Pues eso, comparto mi solución sin ver el resultado del instructor (solo lo vi ya que terminé):

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

<script>

    function dibujarRectangulo(x, y, base, altura, color) {
        var pantalla = document.querySelector("canvas");
        var pincel = pantalla.getContext("2d");

        pincel.fillStyle = color;
        pincel.fillRect(x, y, base, altura);
        pincel.strokeStyle = "black";
        pincel.strokeRect(x, y, base, altura);
    }

    function escribirTexto(x, y, texto) {
        var pantalla = document.querySelector("canvas");
        var pincel = pantalla.getContext("2d");

        pincel.font = "15px Georgia";
        pincel.fillStyle = "black";
        pincel.fillText(texto, x, y);
    }

    function dibujarBarra(x, y, serie, colores, texto) {

        var alturasAcumuladas = 0;

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

            dibujarRectangulo(x, y + alturasAcumuladas, 50, serie[seriesTotales], colores[seriesTotales]);

            alturasAcumuladas += serie[seriesTotales];

        }

        escribirTexto(x + 10, y - 20, texto);

    }

    var serie2009 = [6, 47, 41, 3, 3];
    var serie2019 = [81, 9, 3, 3, 4];

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

    dibujarBarra(50, 50, serie2009, colores, "2009");
    dibujarBarra(150, 50, serie2019, colores, "2019");

</script>

Me tomaron muchas horas poder resolverlo, y un video en YouTube de como depurar (depurar es ejecutar el código línea por línea de código y explicando por paso que valores se van almacenando en las variables), no sé si pueda pasar enlaces por aquí pero busquen en YouTube: "Depurar JavaScript con el Navegador y con Visual Studio" y es el primer resultado; son 38 minutos de video pero vale la pena, ya que es importante esto no solo en este problema, si no en todos...

1 respuesta

Hola Samuel, cómo estas?

Gracias por compartir tu proyecto con nosotros, continua así, felicidades.

Recomendamos que compartas la solución de tus ejercicios en nuestro servidor de Discord, allí tenemos un canal exclusivo para eso (#compartetucodigo) y el foro solo quedaría para cualquier duda que puedas tener sobre el contenido de los cursos.

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios