Adding text labels depending on the position of the line

Good Day Stackoverflowers,

I'm creating a floor plan using canvas. I'm a bit stuck on the part of adding labels beside a line. It should be horizontally and vertically centered and placed outside of the line.

Here's what I'm trying to achieve.

This floorplan is composed of 4 lines. I wish to create a label for each lines depending on the number of lines.

this.floorplan.getWalls().forEach((wall) => {
    this.drawWall(wall);
});

private drawWall(wall: Wall) {
    var startX = wall.startX();
    var startY = wall.startY();
    var endX = wall.endX();
    var endY = wall.endY();

    this.context.beginPath();
    this.context.moveTo(startX, startY);
    this.context.lineTo(endX, endY);
    this.context.lineWidth = width;
    this.context.strokeStyle = color;
    this.context.stroke();

    // add labels here
    var label = wall.getLabel();
}

Hope someone could shed a light.

Thank you.