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

Círculos que cambian de color

Hola, se que el ejercicio es para que sean todos del mismo color pero a mi se me hizo más divertido hacer que sean círculos de colores al azar :D

<meta charset = "UTF8">
<h1>Programa V.3</h1>

<br>
<br>
<br>

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

<script>
    var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");

    pincel.fillStyle = " #eaecee ";
    pincel.fillRect(0, 0, 600, 400);

function pedircirculo(evento){

    console.log(evento);
    var x = evento.pageX - pantalla.offsetLeft;
    var y = evento.pageY - pantalla.offsetTop;
    dibujarcirculo(x,y);
}

function dibujarcirculo(x,y){
    var posicion = Math.round(Math.random() * 10);
    var color = [" #cd6479 "," #cd64aa "," #b964cd "," #8764cd ","#6497cd"," #64cdc2 ","#6ecd64"," #f1f174 ","#ea6161"," #ffffff "," #000000 "]
    pincel.fillStyle = color[posicion];
    pincel.beginPath();
    pincel.arc(x,y,15,0,2*3.14);
    pincel.fill();

}

    pantalla.onclick = pedircirculo;


</script> 
1 respuesta

Se ve mas bonito. Gracias por compartir.