En la página html, están presentes principalmente tres elementos: lienzo, video, div.

A continuación se muestra el CSS para el mismo.

 #myCanvas { position: absolute; height: 100%; width: 100%; top: 0px; object-fit: cover; } #myVideo { padding: 0; width: 100% !important; height: 100% !important; object-fit: cover; -webkit-transform: scaleX(-1); transform: scaleX(-1); display:none; } #divRectArea { position: fixed; border: solid 5px blue; top:79%; left:72%; width: 24%; height: 15%; }

En javascript, estamos dibujando videos en lienzo.

El ancho y la altura del lienzo y el video se establecen en 1080, 1920 respectivamente a través de javascript.

Debido al ajuste del objeto: la cubierta, el lienzo se estira a toda la pantalla (ventana gráfica) [sin mantener la relación de aspecto].

Tenga en cuenta que div (divRectArea) tiene una posición fija en css.

Quiero dibujar el ángulo de reacción exactamente en el mismo lugar donde se coloca div ,

¿Cómo lograr esto?

Gracias de antemano.