Sample code to share, Vanilla JS, Html, CSS.
Details: In the demo links below, click 3 times within the client area of the browser, program will draw red circles in those points, blue parallelogram and yellow circle. Drag points to see it changes. Circle is having the same area as rectangle. App shows points coordinates and circle/parallelogram area.
For regular browsers - JS (24Kb) https://vladimirbuskin.github.io/shapes/demo/
For IE with babel-polyfill - JS (109Kb) https://vladimirbuskin.github.io/shapes/demoIE/