블로그로 돌아가기

개발자를 위한 데이터 시각화 가이드 (Part 2)

막대 차트, 라인 차트, 영역 차트 등 카테고리 비교와 시간에 따른 트렌드를 분석하는 차트 유형을 알아봅니다.

FrontendData Visualization

카테고리 비교와 트렌드 분석

Part 1에서 테이블, 파이 차트, 스파크라인 같은 기초 차트를 살펴봤어요. 이번 Part에서는 한 단계 더 나아가 카테고리 비교시간에 따른 트렌드 분석에 잘 맞는 차트들을 다뤄볼게요.

이런 차트들은 서로 다른 그룹을 비교하거나 시간 흐름에 따른 변화를 추적할 때 잘 맞아요. 트렌드 파악, 성과 추적, 패턴 분석에 자주 쓰이죠.

막대 차트와 라인 차트는 가장 많이 쓰는 차트인 만큼, 잘못 쓰면 오해를 불러일으키기도 해요. 저도 Y축을 0에서 시작 안 해서 데이터가 왜곡돼 보였던 적이 있었어요.


4. 막대 차트

분기별 매출 리포트에서 가장 먼저 꺼내는 차트가 바로 막대 차트예요. 단순하지만 경영진에게 가장 효과적이었어요.

막대 차트는 데이터를 카테고리별로 비교할 때 쓰는 대표적인 그래프예요. 막대 길이가 값에 비례하고, 두 개의 변수가 필요해요. 비율을 정확하게 표현하려면 각 막대가 0에서 시작해야 하죠.

단순한 카테고리 비교에 가장 잘 맞고, 컴팩트해서 읽기도 쉽죠. 변형을 활용하면 좀 더 복잡한 정보도 직관적으로 전달할 수 있어요.

4.1 수직 막대 차트

시간 흐름에 따른 수량을 한눈에 비교할 수 있어요. 여기서는 연도를 기준으로 썼어요.

그림 4.1: 연도별 매출 추이를 보여주는 수직 막대 차트

4.2 수평 막대 차트

수직 막대 차트와 비슷한데, 카테고리 비교에 더 자주 쓰여요. 정확한 숫자를 안 봐도 막대 길이만으로 쉽게 비교할 수 있기 때문이에요.

그림 4.2: 부서별 성과 점수를 비교하는 수평 막대 차트

4.3 누적 막대 차트

카테고리 안에서 합산된 값을 비교할 때 잘 맞아요. 분기별 총 매출을 보여주면서 각 분기의 지역별 매출 구성도 함께 볼 수 있어요.

그림 4.3: 분기별 지역 매출을 보여주는 누적 막대 차트

4.4 그룹화 막대 차트

그룹화 막대 차트는 막대를 나란히 놓아서 비교하는 방식이에요. 연도별이나 카테고리별 데이터를 견줄 때 유용하죠.

그림 4.4: 월별 매출의 전년 대비 비교를 보여주는 그룹화 막대 차트

4.5 100% 누적 막대 차트 (Stacked Percent)

각 막대가 100%를 기준으로 카테고리별 비율을 나타내요. 전체 대비 상대적 비율을 쉽게 비교할 수 있어요.

그림 4.5: 분기별 카테고리 비율을 보여주는 100% 누적 막대 차트

4.6 양수/음수 차트

0을 기준으로 벤치마크 대비 성과를 보여줘요. 양수는 녹색, 음수는 빨간색으로 표시해서 어디가 부족하고 어디가 초과 달성했는지 바로 알 수 있어요.

그림 4.6: 목표 대비 성과를 보여주는 양수/음수 차트 (단위: %)

4.7 폭포 차트 (Waterfall Chart)

시간 흐름에 따라 양수와 음수 값이 누적되는 과정을 보여주는 차트예요. 수익과 비용 같은 금융 데이터에 자주 쓰이는데, 재무팀에 이 차트를 보여줬을 때 "어디서 돈이 새는지 바로 보인다"는 반응이 돌아왔던 게 기억나요.

그림 4.7: 월별 수익/비용 변화를 보여주는 폭포 차트 (시작 83 → 최종 29)

4.8 파레토 차트 (Pareto Chart)

막대 그래프와 라인 그래프를 결합해서 결과의 80%가 원인의 20%에서 비롯된다는 파레토 법칙을 시각화한 차트예요.

개별 값
누적 %
그림 4.8: 장애 원인별 빈도와 누적 백분율을 보여주는 파레토 차트

혹시 막대 차트에서 Y축을 잘라서 쓴 적 있나요? 의도치 않게 데이터를 왜곡하고 있었을 수도 있어요.

막대 차트 핵심 규칙

막대 차트에서 Y축은 반드시 0에서 시작해야 합니다. 그렇지 않으면 비율이 왜곡되어 잘못된 인상을 줄 수 있습니다.


5. 라인 차트

시계열 데이터를 처음 라인 차트로 그렸을 때, 트렌드가 이렇게 명확하게 보이는 거에 좀 감동받았어요. 숫자 나열로는 절대 느낄 수 없는 흐름이 한눈에 들어오기 때문이에요.

라인 차트는 막대 차트와 비슷한 역할을 하지만, 데이터 포인트가 많거나 차이가 너무 작아서 막대로는 구분이 안 될 때 더 유연하게 쓸 수 있어요. 기본 라인 차트는 0에서 시작하지 않아도 되고, 데이터에 맞게 스케일을 확대할 수 있죠.

시간에 따른 트렌드를 보여줄 때 가장 잘 맞고, 특정 데이터 세트(Dataset)에 집중해서 비교하기에도 좋아요.

5.1 기본 라인 차트

시간에 따른 트렌드를 시각화하기 좋고, 특히 변동 폭이 작을 때 효과적이에요.

그림 5.1: 월별 웹사이트 방문자 수 추이를 보여주는 기본 라인 차트

5.2 그룹화 라인 차트

여러 데이터 세트의 시간 흐름 트렌드를 비교할 때는 막대 차트보다 라인 차트가 더 잘 맞아요. 막대 차트는 비율 비교에 더 적합하죠.

그림 5.2: 디바이스별 방문자 트렌드를 비교하는 그룹화 라인 차트

라인 차트 vs 막대 차트

라인 차트는 트렌드를 보여주는 데 탁월하고, 막대 차트는 비율 비교에 더 적합해요. 데이터의 특성에 따라 선택하세요.


6. 영역 차트

영역 차트는 트렌드와 비율을 동시에 보여주는 라인 차트의 변형이에요. 누적 총계를 표현할 때 특히 효과적이고, 색상 음영으로 볼륨감을 나타내죠. 막대 차트처럼 비율을 정확히 보여주려면 0에서 시작해야 해요. 시간에 따라 여러 수량을 비교할 때 쓰여요.

6.1 레이어드(Layered) 영역 차트

두 변수의 주간 데이터를 데이터 포인트를 연결해서 보여줘요.

그림 6.1: 주간 신규/재방문 트래픽을 보여주는 레이어드 영역 차트

6.2 누적 영역 차트

시간에 따른 누적 총계를 보여주면서, 각 카테고리가 전체에 얼마나 기여하는지 한눈에 파악할 수 있어요.

그림 6.2: 채널별 트래픽 누적 추이를 보여주는 영역 차트

7. 스파이더 차트와 변형

스파이더 차트(레이더 차트라고도 해요)는 중앙점에서 뻗어나가는 축을 따라 여러 변수를 시각화하는 차트예요. 극좌표(Polar Coordinates) 방식이라고도 부르죠. 각 축이 서로 다른 카테고리를 나타내고, 데이터 포인트를 연결하면 다각형이 만들어져서 항목 간 비교가 쉬워요.

레이디얼 차트 같은 변형은 동심원 구조로 데이터를 층층이 나눠서 보여주는데, 스킬 매핑, 진행 추적, 성과 평가에 많이 쓰여요. 두 형식 모두 패턴, 강점, 약점을 한눈에 드러내 줘서 분석할 때 유용해요.

7.1 스파이더 차트 (단일 데이터)

축을 따라 데이터 포인트를 연결해 다각형을 만드는 방식이에요. 스킬 매핑이나 성과 평가에 잘 맞아요.

그림 7.1: 개발자 역량 평가를 보여주는 스파이더 차트

7.2 비교형 스파이더 차트

여러 데이터 세트를 겹쳐서 한 번에 비교할 수 있어요.

그림 7.2: 두 팀의 기술 스택 역량 비교 레이더 차트

8. 히스토그램

히스토그램은 생김새가 앞서 다룬 막대 차트와 비슷하지만, 목적은 완전히 달라요. 막대 차트가 카테고리별 크기를 보여준다면, 히스토그램은 "버킷(Bucket, 값의 구간)"으로 묶인 값의 빈도를 보여줘요. 쉽게 말해서, 막대 차트는 "각 제품이 얼마나 팔렸나?"를 보여주고, 히스토그램은 "가격대별로 제품이 몇 개나 있나?"를 보여주는 거예요.

히스토그램을 만들려면 먼저 버킷을 정하고, 각 버킷에 데이터 포인트가 몇 개 들어가는지 세요. 그다음 빈도를 막대로 그리면 돼요. 히스토그램 막대가 서로 붙어 있는 이유는 연속적인 값 범위를 나타내기 때문이에요.

아래는 고객 서비스 통화 시간의 히스토그램이에요. 이 패턴은 **"이봉형(bimodal)"**이라고 하는데, 통화가 아주 짧거나 6분쯤 되는 두 구간에 집중되어 있어요.

그림 8.1: 고객 서비스 통화 시간 분포를 보여주는 히스토그램 (이봉형 패턴)

히스토그램은 데이터 샘플에서 빈도의 큰 흐름을 파악하는 데 유용해요. 막대가 만드는 모양(대칭, 단봉, 이봉 등)을 보면 데이터의 트렌드를 읽을 수 있어요.


9. 불릿 그래프

불릿 그래프는 온도계 차트, 진행 막대, 목표 지표 같은 기능을 하나의 막대 안에 깔끔하게 합쳐놓은 차트예요. 여러 벤치마크 대비 성과를 보여줄 때 적합하죠.

비즈니스 분석에서 특히 유용한데, 간단한 형식으로 실제 성과와 기대치를 나란히 비교할 수 있어요:

  • 중앙선은 실제 값
  • 수직선은 목표 값
  • 색상 밴드는 성과 범위(저조, 평균, 우수)를 나타내요

아래 예시를 보면, Alfa는 목표에 한참 못 미쳤고, BravoDelta는 기대치를 넘겼어요. Charlie는 목표를 아슬아슬하게 놓쳤고요.

그림 9.1: 네 가지 기준의 목표 대비 성과를 보여주는 불릿 그래프

마무리

여기까지 읽으셨다면, 이미 비교와 트렌드 분석에 필요한 핵심 차트들을 모두 익힌 거예요. 지금 만들고 있는 대시보드가 있다면, 데이터의 목적에 따라 어떤 차트가 가장 적합할지 한번 점검해보세요.

Part 2 요약

막대 차트, 라인 차트, 영역 차트는 비교와 트렌드 분석의 핵심 도구입니다. 각 차트의 특성을 이해하고 데이터의 목적에 맞게 선택하세요.

다음 Part에서는 산점도, 버블 차트, 히트맵 등 관계와 클러스터 분석에 쓰이는 차트들을 살펴볼게요.


참고 자료

  • Perceptual Edge — Stephen Few의 데이터 시각화 모범 사례와 비즈니스 인텔리전스 리소스
  • Flowing Data — Nathan Yau의 튜토리얼과 시각화 예시 블로그