Draw dynamic 3d polygon

I am trying to draw polygons dynamically on a 3d object using mouse click event in three js. I want to fill a polygon face, knowing the order of vertices and edges.

  1. How can I fill a polygon face?
  2. Is there a way to fill polygon faces from lineloop geometry?
  3. Are there any other algorithms you can recommend other than Earcut and Deluney algorithms that create triangles from ordered vertices?

The final goal looks like the picture below.


(pix4d cloud image)

code : https://jsfiddle.net/8hg9zty7/