如何使用鼠标事件和标志绘制自由和水平线？

// HTML
<canvas id="canvas"></canvas>

// JavaScript
const canvas = document.getElementById('canvas');
const ctx = canvas.getContext('2d');
let isDrawing = false;
let startX, startY;

canvas.addEventListener('mousedown', (e) => {
  isDrawing = true;
  startX = e.clientX - canvas.offsetLeft;
  startY = e.clientY - canvas.offsetTop;
});

canvas.addEventListener('mousemove', (e) => {
  if (!isDrawing) return;
  const currentX = e.clientX - canvas.offsetLeft;
  const currentY = e.clientY - canvas.offsetTop;
  
  ctx.clearRect(0, 0, canvas.width, canvas.height);
  ctx.beginPath();
  ctx.moveTo(startX, startY);
  ctx.lineTo(currentX, currentY);
  ctx.stroke();
});

canvas.addEventListener('mouseup', () => {
  isDrawing = false;
});

import pygame

# Initialize Pygame
pygame.init()

# Set up the display
width, height = 800, 600
screen = pygame.display.set_mode((width, height))
pygame.display.set_caption("Drawing Lines")

# Colors
BLACK = (0, 0, 0)
WHITE = (255, 255, 255)

# Variables
is_drawing = False
start_pos = None

# Main game loop
running = True
while running:
    for event in pygame.event.get():
        if event.type == pygame.QUIT:
            running = False
        elif event.type == pygame.MOUSEBUTTONDOWN:
            if event.button == 1:  # Left mouse button
                is_drawing = True
                start_pos = event.pos
        elif event.type == pygame.MOUSEMOTION:
            if is_drawing:
                current_pos = event.pos
                screen.fill(BLACK)
                pygame.draw.line(screen, WHITE, start_pos, current_pos, 2)
        elif event.type == pygame.MOUSEBUTTONUP:
            if event.button == 1:  # Left mouse button
                is_drawing = False

    pygame.display.flip()

# Quit Pygame
pygame.quit()