곡선 위 두 점 사이 간격이 줄고 두 점을 잇는 선이 접선에 가까워진다.Two points on a curve approach each other as their secant approaches a tangent.
고정점 옆의 점을 가까이 옮기며 할선 기울기를 함께 갱신한다.
점 간격을 0으로 만들어 기울기 계산이 깨진다.
기본값은 클립에 쓴 값Defaults are the values used in the clip
| 항목PARAM | 기본DEFAULT | 범위RANGE | 메모NOTE |
|---|---|---|---|
| 기본 지속 | 2.2s | 1.54~3.08s | 첫 동작 또는 후보의 기본 단계 길이 |
| 점 간격 | 160→4px | 80~240px → 2~8px | 최소 간격은 0보다 크게 둔다 |
| 이징 | power2.inOut | none | power2.out | power2.inOut | 주파수 변화는 선형으로 두고 위치 변화는 완만하게 연결한다. |
const tl = gsap.timeline({paused:true});
const state={h:160}, f=x=>0.002*x*x;
const draw=()=>{const h=state.h,m=(f(200+h)-f(200))/h; gsap.set(point,{x:200+h,y:f(200+h)}); line.setAttribute("x1",100); line.setAttribute("y1",f(200)-100*m); line.setAttribute("x2",400); line.setAttribute("y2",f(200)+200*m);};
tl.to(state,{h:4,duration:2.2,ease:"power2.inOut",onUpdate:draw});
draw();그대로 붙여 넣는다Paste as is
<파일>에서 <대상>에 할선에서 접선으로 수렴을 적용해. 곡선 위 두 점 사이 간격이 줄고 두 점을 잇는 선이 접선에 가까워진다. 함수 샘플 두 점과 자체 할선 좌표를 동시에 SVG로 갱신한다. 기본 지속은 2.2s, 점 간격은 160→4px, 이징은 power2.inOut로 설정한다. 하나의 paused GSAP 타임라인으로 구성하고 seek할 때 좌표와 표시 상태를 다시 계산해.
Apply Secant-to-tangent Convergence to <target> in <file>. Two points on a curve approach each other as their secant approaches a tangent. Use a base duration of 2.2s and power2.inOut; use point separation from 160px to 4px and preserve semantic correspondence. Build one paused GSAP timeline and recompute geometry and visibility when seeking.
<파일>의 설명 장면에서 <대상>에 할선에서 접선으로 수렴을 적용해. 기본 지속은 2.2s, 점 간격은 160→4px, 이징은 power2.inOut로 설정한다. 0초, 1.1초, 2.2초 시점을 캡처해 초기 상태, 중간 대응 관계, 첫 동작의 완료 상태를 확인해. 원본과 결과의 의미 대응 및 라벨 가독성을 검증해.
Implement Secant-to-tangent Convergence in the explanatory scene of <file> for <target>, using 2.2s and power2.inOut with point separation from 160px to 4px. Capture at 0, 1.1, and 2.2 seconds to check the initial state, intermediate correspondence, and completion of the first motion. Verify matching source and result elements and readable labels.
HyperFrames · ReelForge · Scrolline
개념 출처와 라이선스. 구현은 이 레포에서 새로 씀Concept sources and licenses. Implementations are original to this repo