Ayuda con polígono(canvas)+colores!
Publicado por Rommstroi (2 intervenciones) el 21/07/2017 01:10:26
Hola, buenas, junto con saludarlos, tengo un tremendo problema o confusión más bien, resulta que necesito crear una figura o polígono que se mueve y debe ir cambiando tal como lo hice, sólo que debe terminar en un cuadrado e ir minimizando su tamaño, y termina en una línea y estoy confundido, para que pase de una línea, luego al rectángulo y a un cuadrado y desaparecer, empieza bien el polígono, luego pasa a rectángulo, luego no cambia a cuadrado. Además de eso, quiero que la figura o canvas, pueda cambiar de color usando la función click con al menos 5 colores, sólo logré que cambie a un color. Y también al utilizar dicha función (función click) se genere un texto con jquery que indique el alto y largo de la figura en movimiento.
Este es el código y ayuda por favor, estoy súper frustrado, porque he intentado horas y horas con diferentes ideas y nada, bueno, eso, saludos y desde ya gracias.
Este es el código y ayuda por favor, estoy súper frustrado, porque he intentado horas y horas con diferentes ideas y nada, bueno, eso, saludos y desde ya gracias.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<!DOCTYPE html>
<html>
<head>
<title>Lienzo aka canvas</title>
</head>
<body>
<canvas id="micanvas" width="400" height="400"></canvas>
<p id="micanvas"></p>
<script src="https://code.jquery.com/jquery-2.1.0.js"></script>
<script>
var canvas = document.getElementById("micanvas");
var ctx = canvas.getContext("2d");
var posicion = 0; var tamano = 0;setInterval(function () {
ctx.clearRect(0, 0, 400, 400);
ctx.fillRect(0, posicion, tamano, 400);
posicion++;
tamano++;
if (posicion > 400){
posicion = 0; tamano = 0; }}, 30);
canvas.onclick = function() {
ctx.fillStyle = 'red', 'yellow', 'blue', 'green', 'purple' ;
};</script>
</body>
</html>
Valora esta pregunta
0
