Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Chamada Array em função

Referente ao curso JavaScript e HTML: pratique lógica com desenhos, animações e um jogo

por Clarisse de Almeida e Alvarenga
| 509.4k xp | 47 posts
Gerente de Relacionamento em Negócios Internacionais

Tentei aplicar o exercício do gráfico em uma outra aplicação, para ver se entendi a lógica do uso de Arrays, mas claramente não peguei o jeito.

Segue o meu código. Como complemento, este código não foi editado no Sublime, mas sim no bloco de notas, e salvei com Encoding UTF-8.

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

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



function desenhaArco (x,y,raio,cor){

var tela = document.querySelector ("canvas");
var pincel = tela.getContext ("2d");
    pincel.fillStyle = cor;
    pincel.beginPath ();
    pincel.arc (x,y,raio,0,3.14)
    pincel.fill ();
}

function desenhaArcoIris (x,y,raio,cor){

    var somaRaio = 0 //variável auxiliar

    for (var i = 0; i<cor.lenght;i++){


        var cor = cor[i]
        desenhaArco (x,y,somaRaio,cor[i]);
        somaRaio = somaRaio+raio




        }

}


var cor = ["white","purple","violet","blue", "green", "yellow", "orange","red"]

desenhaArcoIris (300,200,100,cor);
</script>
2 respostas
por Daniel Omnion
| 1015.4k xp | 1150 posts

Pelo que eu vi, o "for" no array não funcionou. Faça o seguinte ajuste na função.

function desenhaArcoIris (x,y,raio,cor){
    var somaRaio = 0 //variável auxiliar
    for (var i = 0; i< cor.length;i++){
        desenhaArco (x,y,somaRaio,cor[i]);
        somaRaio = somaRaio+raio
    }
}

Porem, o resultado final não é um arco iris, ele está deixando o canvas vermelho.

solução!
por Clarisse de Almeida e Alvarenga
| 509.4k xp | 47 posts
Gerente de Relacionamento em Negócios Internacionais

Daniel, muito obrigada pela dica.

Depois de muito bater a cabeça, acho que eu consegui!

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

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


function desenhaArco (x,y,raio,cor){

    pincel.fillStyle = cor;
    pincel.beginPath ();
    pincel.arc (x,y,raio,3.14,0)
    pincel.fill ();
}

function desenhaArcoIris (x,y,cor){

    var raio = 200//variável auxiliar

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


        desenhaArco (x,y,raio,cor[i]);
        raio = raio-25        

                }

}

var cor = ["purple","violet", "darkblue","blue","green", "yellow", "red","white"];


desenhaArcoIris (300,300,cor);



</script>