SVG Animation Examples Gallery

'use client'; import React, { useState, useEffect, useRef, useMemo } from 'react'; const VIEW_WIDTH = 1000; const VIEW_HEIGHT = 600; const CENTER_Y = VIEW_HEIGHT / 2; const CIRCLE_X = 150; const WAVE_START_X = 300; const RADIUS = 80; export const SineWaveView = () => { // 动画相位状态 const [phase, setPhase] = useState(0); const requestRef = useRef<number>(); const previousTimeRef = useRef<number>(); // 动画循环 const animate = (time: number) => { if (previousTimeRef.current !== undefi