Codigos
let angle = 0; //mi variable
Angulo con un valor de 0
//cambiamos un poco el ángulo,
cantidad al igual que la velocidad angular
//Angulo segunda parte
let angleV = 0;
Let increment = 0;
function setup() {
createCanvas(400, 400);
}
function draw() {
background(0);
translate(200, 200);
fill(252, 238, 33);
//s quiere que r sea el resultado
del seno del ángulo
//se multiplica el seno del
ángulo por 200 y se vera el valor oscilado entre 200 y -200
//se mapea el seno del ángulo y este
tiene un rango de -1 y 1 y gracias a esto se vera
//como si empezara a respirar, el
reajuste dela amplitud
let r = map(sin(angle),
-1, 1, 0, 200);
circle(0,
0, r * 2);
//decimos el incremento será
igual a 2pi que me equivale a 360°
//dividido entre / 60cuadros
let increment = TWO_PI / 60;
//este es para que el ángulo
aumente con el time
// lo comentamos por un rato
= angle += 0.02;
//angle += increment;
//ángulo sengunda parte
angle += angleV;
//el ángulo v cambia con el
tiempo 2 parte, empezara a cambiar de velocidad con el tiempo
angle += 0.0001
//la velocidad en fotogramas
console.log(frameRate())
//aplicando eso se deveriaa de
ver unos 60 fotogramas por segundo
//mientras que el periodo es la
cantidad de tiempo, se necesita un ciclo completo de ola
//la frecuencia es 1 dividida por
el periodo 1/periodo = cantidad que se
repite la ola dentro de una //unidad de tiempo
//si la unidad fuera 1 segundo,
el periodo 1, entonces la frecuencia también lo será, un ciclo //repetido, solo
que en 60 fotogramas 1/60
}
//en la primera parte se
observara lo mismo solo que en este caso conforme pase le tiempo
//la velocidad en hacerse grande
y pequeño será mas rápido.
let angle = 0;
let angleV = 0.05;
function setup() {
createCanvas(600, 400);
}
function draw() {
background(0);
translate(300, 200);
fill(252, 238, 33);
//para que me pueda dibujar como
un tipo lazo
stroke(252, 238, 33);
//let r = map(sin(angle), -1, 1, 0, 200);
//se mapea un poco su posición
//tomando como resultado el seno
del ángulo
let y = map(sin(angle), -1, 1, -200, 200);
strokeWeight(4);
line(0,
0, 0, y);
circle(0, y, 32);
angle
+= angleV;
}
//se empieza con una variable
ángulo
//let angle = 0;
//se le agrega una matriz al
código, será una matriz vacia
let time = 0;
let wave = [];
let path = [];
let slider;
function setup() {
createCanvas(600, 400);
slider
= createSlider(1, 50, 5);
}
function draw() {
background(0);
//150 px hacia arriva y 200 hacia
abajo
translate(150, 200);
let x =
0;
let y =
0;
//lo que se quiere es comenzar
con x y y en ceros
//se hace un bucle, n pasa de
ceros
for (let i = 0; i <
slider.value(); i++) {
let
prevx = x;
let
prevy = y;
let n
= i * 2 + 1;
//se crea el radio
//x sea igual al radio
multiplicado por el coseno
//cuatro dividio por pi, veces
coseno
let radius = 75 * (4 / (n * PI));
x += radius * cos(n * time);
//el radio multiplicado por el
seno del tiempo
y += radius * sin(n * time);
//un objeto de color blanco ósea
el circulo
stroke(255, 100);
noFill();
//espera el diámetro, el radio a
la mitad
ellipse(prevx, prevy, radius * 2);
//fill(255);
//se pinta de color blanco
nuevamente
stroke(255);
//se dibuja la linea desde cero,
cero ax, y.
line(prevx, prevy, x, y);
//se crea otro circulo mas
pequeño de una dimensión de 8px
//ellipse(x, y, 8);
}
//se va a guardar ese valor de y
en particular
wave.unshift(y);
//se traduce a 200px
translate(200, 0);
//para poder trazar una linea
line(x - 200, y, 0,
wave[0]);
//el begin y el end me sirven
Para unir todos los componentes que se vera
//la ola es desir marcara el
rastro
beginShape();
noFill();
//dejamos a x, no lo vamos a usar
//i es iguala cero, i es menor
que la longitud de onda
for (let i = 0; i <
wave.length; i++) {
//dibujamos un punto en I, en la
ola, y en el índice
vertex(i, wave[i]);
}
endShape();
//el movimiento que se genera
desde el punto pequelo al centro del radio de mi circulo
//grande
time +=
0.05;
//sentencia de donde llegara la
línea ya que se sumaran los puntos
//ya finalizado de volvera a
repetir el proceso
if (wave.length >
250) {
wave.pop();
}
}
Comentarios
Publicar un comentario