{"id":426,"date":"2022-10-06T11:04:34","date_gmt":"2022-10-06T09:04:34","guid":{"rendered":"http:\/\/quadern-programacio.recursos.uoc.edu\/?page_id=426"},"modified":"2022-10-06T11:04:34","modified_gmt":"2022-10-06T09:04:34","slug":"7-3-movimiento-ondulatorio","status":"publish","type":"page","link":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/7-3-movimiento-ondulatorio\/","title":{"rendered":"7.3. Movimiento ondulatorio"},"content":{"rendered":"

En ocasiones, podemos querer crear movimientos m\u00e1s sutiles de oscilaci\u00f3n; es aqu\u00ed cuando necesitaremos repasar un poco de trigonometr\u00eda, ya que haremos uso de las funciones seno y coseno que nos ofrece P5.js, sin()<\/span> y cos()<\/span>.<\/p>\n

Si tomamos como referencia un c\u00edrculo de una unidad de radio (c\u00edrculo unitario), tanto el seno como el coseno de un \u00e1ngulo no son m\u00e1s que valores que oscilan entre \u20131 y 1 a medida que el valor del \u00e1ngulo del c\u00edrculo aumenta o disminuye.<\/p>\n

Recordemos que en P5 se trabaja por defecto con los \u00e1ngulos en radianes y no en grados, y que el sentido positivo es en la direcci\u00f3n de las agujas del reloj y no al contrario (ya que nuestras coordenadas y<\/em> en nuestro canvas<\/em> crecen hacia abajo). De esta manera, podemos establecer el seno y coseno siguiendo la siguiente figura:<\/p>\n

\"\"
Figura 86. Seno y coseno
Fuente: elaboraci\u00f3n propia.<\/figcaption><\/figure>\n

Vemos que comenzando en 0\u00ba (0 radianes), el seno va aumentando hasta llegar a un valor de 1 al alcanzar los 90\u00ba (PI\/2 en radianes, HALF_PI<\/span> en P5). A continuaci\u00f3n, va disminuyendo hasta 0 al alcanzar los 180\u00ba (PI<\/span>), sigue disminuyendo hasta \u20131 cuando alcanza los 270\u00ba (PI + HALF_PI<\/span>) y luego aumenta hasta llegar de nuevo a 0 cuando el \u00e1ngulo alcanza los 360\u00ba (TWO_PI<\/span>). El coseno para 0\u00ba empieza con un valor de 1, disminuye hasta \u20131 en los 180\u00ba y aumenta hasta 1 de nuevo en los 360\u00ba.<\/p>\n

Tabla 3. Valores de seno y coseno<\/p>\n<\/div>\n\n\n\n\n\n\n\n
\u00c1ngulo en grados<\/strong><\/td>\n\u00c1ngulo en radianes<\/strong><\/td>\nSeno<\/strong><\/td>\nCoseno<\/strong><\/td>\n<\/tr>\n
0 o 360<\/td>\n0 o 2 \u00d7 PI<\/td>\n0<\/td>\n1<\/td>\n<\/tr>\n
90<\/td>\nPI \/ 2<\/td>\n1<\/td>\n0<\/td>\n<\/tr>\n
180<\/td>\nPI<\/td>\n0<\/td>\n\u20131<\/td>\n<\/tr>\n
270<\/td>\n3 \u00d7 PI \/ 2<\/td>\n\u20131<\/td>\n0<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

Fuente: elaboraci\u00f3n propia.<\/p>\n<\/div>\n

Si tenemos un valor de \u00e1ngulo que vaya aumentado constantemente, su seno o su coseno variar\u00e1n constantemente tambi\u00e9n entre \u20131 y 1, lo cual nos puede resultar muy \u00fatil. Veamos un ejemplo sencillo construido en P5.js:<\/p>\n

\"\"
Figura 87. Imprimiendo en la consola los valores de sin()<\/span>
Fuente: elaboraci\u00f3n propia.<\/figcaption><\/figure>Podemos observar que efectivamente los valores que nos devuelve sin()<\/span> fluct\u00faan entre \u20131 y 1 seg\u00fan vamos aumentando el valor del \u00e1ngulo. Veamos ahora c\u00f3mo podemos utilizar estos valores para controlar el movimiento de un c\u00edrculo:<\/p>\n

\"\"
Figura 88. Haciendo oscilar un c\u00edrculo mediante sin()<\/span>
Fuente: elaboraci\u00f3n propia.<\/figcaption><\/figure>Como ya sabemos que los valores que sin()<\/span> nos va a devolver van a oscilar entre \u20131 y 1, podemos usar el m\u00e9todo map()<\/span> para ajustar ese rango al rango del movimiento que queramos darle a nuestra figura; en este caso del rango (\u20131, 1) pasamos a (50, 350).<\/p>\n","protected":false},"excerpt":{"rendered":"

En ocasiones, podemos querer crear movimientos m\u00e1s sutiles de oscilaci\u00f3n; es aqu\u00ed cuando necesitaremos repasar un poco de trigonometr\u00eda, ya que haremos uso de las funciones seno y coseno que nos ofrece P5.js, y . Si tomamos como referencia un c\u00edrculo de una unidad de radio (c\u00edrculo unitario), tanto el seno como el coseno de […]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"acf":[],"_links":{"self":[{"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/pages\/426"}],"collection":[{"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/comments?post=426"}],"version-history":[{"count":1,"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/pages\/426\/revisions"}],"predecessor-version":[{"id":427,"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/pages\/426\/revisions\/427"}],"wp:attachment":[{"href":"http:\/\/quadern-programacio.recursos.uoc.edu\/es\/wp-json\/wp\/v2\/media?parent=426"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}