echarts-performance-tips
정보
이 스킬은 대용량 데이터셋을 처리할 때 ECharts 시각화의 성능 최적화 기법을 제공합니다. 1만 포인트 이상의 데이터에 대한 점진적 렌더링, 시계열 데이터 샘플링, 적절한 차트 라이프사이클 관리 등 구체적인 지침을 포함합니다. 데이터 집약적인 ECharts 구현의 효율성을 개선해야 할 때 이 참고 자료를 활용하세요.
빠른 설치
Claude Code
추천npx skills add vamseeachanta/workspace-hub -a claude-code/plugin add https://github.com/vamseeachanta/workspace-hubgit clone https://github.com/vamseeachanta/workspace-hub.git ~/.claude/skills/echarts-performance-tipsClaude Code에서 이 명령을 복사하여 붙여넣어 스킬을 설치하세요
GitHub 저장소
연관 스킬
d3js
기타이 스킬은 개발자들이 D3.js를 사용하여 완전히 사용자 정의된 인터랙티브 데이터 시각화를 만들 수 있게 해주며, SVG 요소와 데이터 바인딩에 대한 완전한 제어권을 제공합니다. 표준 라이브러리로는 구현할 수 없는 정교한 전환 효과와 상호작용을 갖춘 독특하고 복잡한 차트를 구축하는 데 이상적입니다. 단순한 사전 스타일링된 차트가 아닌 맞춤형 데이터 기반 시각화가 필요할 때 사용하세요.
plotly-with-pandas
기타이 스킬은 데이터프레임에서 간소화된 데이터 시각화를 위해 Pandas와 Plotly 통합을 제공합니다. CSV 데이터에서 직접 플롯을 생성할 수 있으며, 수학적 시각화를 위한 NumPy 호환성을 포함합니다. 대화형 차트가 필요한 Jupyter 환경에서 표 형식 데이터를 작업할 때 사용하세요.
echarts-with-react
기타이 스킬은 차트 초기화, 옵션 업데이트 및 반응형 크기 조정을 처리하는 ECharts용 React 컴포넌트 래퍼를 제공합니다. 자동화된 생명주기 관리가 필요한 React 애플리케이션에 ECharts 시각화를 통합하는 개발자에게 이상적입니다. 이 컴포넌트는 적절한 차트 관리를 위해 언마운트 시 정리 작업과 창 크기 조정 리스너를 포함합니다.
chartjs-1-use-responsive-containers
기타이 스킬은 반응형 차트 컨테이너와 적절한 라이프사이클 관리를 위한 Chart.js 모범 사례를 제공합니다. 적절한 종횡비 제어를 통해 차트를 반응형 div로 감싸는 방법과 메모리 누수를 방지하기 위해 재생성 전에 차트를 제거하는 방법을 보여줍니다. 웹 애플리케이션에서 동적이거나 크기 조절 가능한 Chart.js 시각화를 구현할 때 사용하세요.