nextJs

바이낸스 api로 차트 만들기

woojin06 2025. 9. 22. 20:24

전 블로그에 바이낸스 api로 트레이딩뷰에서 제공하는

lightweight-charts

를 활용해 차트를 만들어보겠다 

 

우선 활용을 위한 돔을 만들어준다.

const chartContainerRef = useRef<HTMLDivElement>(null);
const chartInstance = useRef<IChartApi | null>(null);
const seriesInstance = useRef<ISeriesApi<"Candlestick"> | null>(null);

그 후 fetch를 사용중이기 때문에 useEffect를 호출해 데이터 가공 및 차트를 만들어준다.

그리고 이제 렌더링 된 화면을 보자

그런데 차트가 뭔가 이상하다 다음시간에 디버깅을 해보자...