Removing lines that are very close to each other

I am using opencv.js to detect some lines in an image using the houghp transform. This is the result I am getting -

download

And here is the function call -

let lines = new cv.Mat();
 cv.HoughLinesP(canny, lines, 1, Math.PI / 180, 50, 50, 5);

I want the lines that are parallel and close to each other to be only counted as one line. I tried changing the maxlinedistance but it is not reliable enough. I tried looping over the lines and comparing the x and y coordinates of the detected lines. The problem is, I couldn’t figure out how to delete the lines that I don’t need. Here is the code for that -

for (let i = 0; i < lines.rows; ++i) {
                let x1 = lines.data32S[i * 4];
                let y1 = lines.data32S[i * 4 + 1];
                let x2 = lines.data32S[i * 4 + 2];
                let y2 = lines.data32S[i * 4 + 3];
                for (let j = i+1; j < lines.rows; ++j) {
                    let x3 = lines.data32S[j * 4];
                    let y3 = lines.data32S[j * 4 + 1];
                    let x4 = lines.data32S[j * 4 + 2];
                    let y4 = lines.data32S[j * 4 + 3];
                    if (Math.abs(x1-x3) < 10 || Math.abs(y1-y3) < 10 || Math.abs(x2-x4) < 10 || Math.abs(y2-y4) < 10) {
                        lines.row(j).delete(); // pseudocode
                        j--;
                    }
                }
            }   

Any help is appreciated. Thanks!