[Python] Swimming-specific keypoint connections for skeleton visualization (joint lines)

would you help me to fix the issue with swimmer keypoints connection. I am trying to apply joints connection to the video with swimmer. To detect the technique and other parameters.

The code tat I have shows only overlay without accurate connection to the swimmer's body.

import React, { useRef, useEffect, useCallback } from 'react';
import { KeypointCoordinate } from '@shared/swimming-keypoints';

interface PoseOverlayProps {
videoElement: HTMLVideoElement | null;
keypoints: KeypointCoordinate[];
confidence: number;
isVisible: boolean;
onCanvasReady?: (canvas: HTMLCanvasElement) => void;
}

// Swimming-specific keypoint connections for skeleton visualization
const SWIMMING_CONNECTIONS = [
// Head connections
[0, 1], // nose to left_eye
[0, 2], // nose to right_eye
[1, 2], // left_eye to right_eye
[0, 4], // nose to neck

// Torso connections
[4, 5], // neck to left_shoulder
[4, 6], // neck to right_shoulder
[5, 6], // shoulder to shoulder
[5, 7], // left_shoulder to chest_center
[6, 7], // right_shoulder to chest_center
[7, 32], // chest_center to pelvis_center
[32, 8], // pelvis_center to left_hip
[32, 9], // pelvis_center to right_hip
[8, 9], // hip to hip

// Left arm connections
[5, 10], // left_shoulder to left_elbow
[10, 20], // left_elbow to left_forearm_mid
[20, 12], // left_forearm_mid to left_wrist
[12, 14], // left_wrist to left_hand_tip
[12, 16], // left_wrist to left_thumb
[12, 18], // left_wrist to left_pinky

// Right arm connections
[6, 11], // right_shoulder to right_elbow
[11, 21], // right_elbow to right_forearm_mid
[21, 13], // right_forearm_mid to right_wrist
[13, 15], // right_wrist to right_hand_tip
[13, 17], // right_wrist to right_thumb
[13, 19], // right_wrist to right_pinky

// Left leg connections
[8, 22], // left_hip to left_knee

Continue reading...