RECTÁNGULOS Y CÍRCULOS

Libreria básica para el manejo de colisiones

Dependencia


Está librería fue pensada principalmente para trabajar con p5.js, es por esta razón que deben incluirla en el proyecto, sin embargo si no se va a hacer uso de Rectangle.draw() el programa no debería hacer ningún reclamo por consola

https://p5js.org/es/download/

Rectángulos y circulos


En esta librería encontrarás herramientas suficientes para trabajar con rectángulos y circulos, de forma sencilla, haciendo uso de algoritmos programados y desarrollados por mi. una vez creados los elementos podrás moverlos, redimensionarlos, calcular sus colisiones, uniones e intersecciones, todo desde código. Esta librería está principalmente orientada para la creación de juegos básicos, para lo que normalmente denominan los hitbox en los juegos.

CDN

trabajar con rectángulos


El rectángulo es un objeto muy útil en la programación de gráficos. Tiene su propia clase en esta librería y se usa para almacenar y manipular un área rectangular. Un objeto puede ser creado dando la posición y el tamaño. Ejemplo: Esto crea un rectángulo en la posición (0,0) y de tamaño 100×100

Para obtener los valores una vez establecidos o modificados, es con las propiedades pos y size, justo cómo mostraré a continuación:

Funciones tipo GET

Estas funciones ayudan a obtener en tiempo real ciertos datos del objeto, aún después de haberlo modificado

Mover los rectángulos

Código en tiempo real

Redimensionar los rectángulos

Esta función recibe un ancho y un alto, cualquier valor real, negativo o positivo
Código en tiempo real

Colisión punto-rectángulo

Código en tiempo real

Colisión rectángulo-rectángulo

Código en tiempo real

¿Está dentro de otro rectángulo?

Código en tiempo real

Intersecto rectángulo-rectángulo

Código en tiempo real

Unión rectángulo-rectángulo

Código en tiempo real

trabajar con Circulos


Los circulos en muchas ocasiones pueden dar mejor estimación de colisión que un rectángulo, su inicialización es muy similar a la de los rectángulos cx: es la abscisa del centro del círculo
cy: es la ordenada del centro del círculo
r:  es el diametro del círculo Esto crea un círculo en la posición (0,0) con un diametro de 100

reposición de circulos

Código en tiempo real


Redimensión de círculos

Código en tiempo real


Rectángulo contenedor

Código en tiempo real


Colisión punto-círculo

Código en tiempo real


Colisión círculo-rectángulo

Código en tiempo real


Colisión círculo-círculo

Código en tiempo real


¿Está dentro de otro círculo?

Código en tiempo real