How to make a similar underline effect?

Question

JavaScript

There is a block on the page with a photo of a group of people standing separately (there are actually several photos and people in each of them in different poses). It is necessary that when you hover over a person, a bar appears below him.
Guidance along the contour, as far as I understand, you can’t do without svg, well, in principle, I was provided with svg in which somewhere is a polygon, somewhere is a path.
I decided that I would make a container with relative positioning, inside I would insert svg and a div that would be a line. When hovering over an object, the div will get top and left. But I can’t figure out how I can get the coordinates of the lower left corner of the object that I pointed to.
Link to jsfiddle
Approximate arrangement of lines when hovering over an object

Answer 1

https://jsfiddle.net/3gvd2w5z/55/
- complete implementation

Answer 2

https://jsfiddle.net/enfernal/3gvd2w5z/33/