Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Solucionado (ver solución)
Solucionado
(ver solución)
2
respuestas

Problema con el ejercicio de barras de porcentaje. (Lógica 3)

No logro graficar las barras como requiere el problema de la función dibujarBarra()

<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) {
            escribirTexto(x, y - 10, texto)

            for(var i = 0; i < serie.length; i++){
                dibujarRectangulo(x, y, 50, serie[i], colores[i]);

            }
    }

        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, serie2009, colores, "2019")      




</script>
2 respuestas

Hola Luis, espero que estés bien!

Creo que la segunda línea debería recibir serie2019, ¿verdad?

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

Saludos

solución!

Hola, brenda! gracias por contestar. Si, efectivamente tenía un error de sintaxis en esa parte, también me faltaba declarar una variable para la iteración de mi loop for.

Anexo mi solución:

    function dibujarBarra(x, y, serie, colores, texto){
            escribirTexto(x, y - 10, texto)

                var cont = 0;
                for(var i = 0; i < serie.length; i++){
                    var h = serie[i];
                    dibujarRectangulo(x, y + cont, 50, h, colores[i]);
                    cont = cont + h;
                }

    }