Search code examples
javascriptfabricjs

Position text in the midpoint of a line using fabric.JS?

I am currently trying to position text in the middle of a line. I do know the equation - the two point’s vector’s averages - but they seem to appear in a different position. I am using

texts[0].set({
   text: value,
   left: (points[0] - points[2]) / 2,
   top: 345,
   textAlign: “center"
});

Are the left and top the same as X and Y? Points of the line are calculated as the following:

points = [360 - (value.length * 80), 300, 300, 300]

Thank you!

Solution

  • I was being an idiot, and found the problem: I was subtracting the point's X positions. This is why you shouldn't do 12 AM scripting, kids!