Span Chart

설명 / Description

범위 차트(범위 차트라고도 함)는 범주별로 두 개의 정량적 값을 막대나 마크의 시작점과 끝점으로 인코딩하여, 구간을 전달하는 떠 있는 막대를 만들어냅니다. 모든 막대가 0에 고정되는 표준 막대 차트와 달리, 범위 차트의 막대는 최솟값과 최댓값 사이에 떠 있어서, 독자의 주의를 절대적 크기가 아니라 두 값 사이의 간격으로 이끕니다.

A span chart (also called a range chart) encodes two quantitative values per category as the start and end of a bar or mark, producing a floating bar that conveys an interval. Unlike a standard bar chart where every bar is anchored at zero, span chart bars float between their minimum and maximum, drawing the reader's attention to the gap between two values rather than their absolute magnitudes.

범위 차트는 기온의 최고/최저치, 급여 구간, (가로로 사용될 때의) 프로젝트 타임라인, 신뢰구간과 같은 범위를 보여줄 때 특히 유용합니다. 각 막대의 길이는 범위의 크기를 인코딩하고, 값 축을 따른 위치는 절대적 수준을 인코딩합니다. 따라서 독자는 한 화면에서 범주 간 값의 크기와 퍼짐을 모두 비교할 수 있습니다.

Span charts are particularly useful for showing ranges such as temperature highs and lows, salary bands, project timelines (when used horizontally), or confidence intervals. The length of each bar encodes the size of the range, while the position along the value axis encodes the absolute level. Readers can thus compare both the magnitude and the spread of values across categories in a single view.

막대가 공통 기준선에 고정되지 않으므로, 범주 간 절대적인 시작값이나 끝값을 비교하려면 표준 막대 차트보다 더 많은 인지적 노력이 필요합니다. 하지만 막대 길이가 직접 비교 가능하므로 범위 너비를 비교하는 것은 간단합니다. 절대값도 중요한 경우 기준선 문제를 완화하기 위해 참조선이나 주석을 추가할 수 있습니다.

Because bars are not anchored to a common baseline, comparing absolute start or end values across categories requires more cognitive effort than in a standard bar chart. However, comparing range widths is straightforward since the bar lengths are directly comparable. Adding reference lines or annotations can mitigate the baseline problem when absolute values also matter.

언제 사용하나 / When to Use

• 일일 기온 최고/최저치나 급여 구간 같은 최솟값-최댓값 범위 표시
• Displaying minimum-maximum ranges such as daily temperature highs/lows or salary bands
• 점 추정치와 함께 신뢰구간, 오차 범위, 또는 불확실성 범위 표시
• Showing confidence intervals, error margins, or uncertainty ranges alongside point estimates
• 범주 간 퍼짐이나 변동성 비교
• Comparing the spread or variability across categories
• 범주 축에서 작업이나 이벤트의 예정된 기간(시작-끝) 표현
• Representing scheduled durations (start-to-end) for tasks or events on a categorical axis

이럴 땐 피하세요 / When NOT to Use

• 범주당 단일 값만 필요할 때 -- 막대 차트를 사용하세요
• When only a single value per category is needed -- use a bar chart
• 범위보다 정확한 시작/끝 값이 더 중요할 때 -- 레이블이 붙은 끝점이 있는 표나 점 도표를 사용하세요
• When precise start/end values matter more than the range -- use a table or dot plot with labeled endpoints
• 범주에 시간적 순서가 있고 초점이 추세일 때 -- 음영 신뢰구간이 있는 선 그래프를 사용하세요
• When categories have temporal ordering and the focus is trend -- use a line graph with a shaded confidence band
• 범위가 광범위하게 겹치고 범주가 많을 때 -- 차트가 복잡해지므로 분포를 위해 박스 플롯을 고려하세요
• When ranges overlap extensively and many categories exist -- the chart becomes cluttered; consider a box plot for distributions

구조 / Anatomy

• 떠 있는 막대: 범위의 하한에서 시작해 상한에서 끝나는 직사각형 마크로, 0에 고정되지 않습니다.
• Floating bars: Rectangular marks that begin at the range's lower bound and end at the upper bound, not anchored at zero.
• 범주 축: 이산 그룹을 나열합니다(범주당 막대 하나).
• Category axis: Lists the discrete groups (one bar per category).
• 값 축: 데이터의 전체 범위를 아우르는 정량적 척도. 인코딩이 위치 대 기준선이 아니라 위치 대 위치이므로 0에서 시작할 필요가 없습니다.
• Value axis: A quantitative scale spanning the full range of data. Does not need to start at zero since the encoding is position-to-position, not position-to-baseline.
• 참조선: 의미 있는 임계값(예: 평균, 예산 목표)에 있는 선택적 세로선이나 가로선.
• Reference line: An optional vertical or horizontal line at a meaningful threshold (e.g., average, budget target).
• 레이블: 범주 축의 범주명; 정확한 값을 위한 막대 끝점의 선택적 주석.
• Labels: Category names on the category axis; optional annotations at bar endpoints for precise values.

변형 / Variations

• 간트 차트: 값 축이 시간인 가로형 범위 차트로, 프로젝트 일정 관리에 사용됩니다.
• Gantt chart: A horizontal span chart where the value axis is time, used for project scheduling.
• 덤벨 차트(연결 점 도표): 떠 있는 막대를 선으로 연결된 두 점으로 대체하여 채워진 범위가 아니라 끝점을 강조합니다.
• Dumbbell chart (connected dot plot): Replaces the floating bar with two dots connected by a line, emphasizing the endpoints rather than the filled range.
• 발산형 범위 차트: 막대가 중심 참조값에서 양방향으로 뻗어 나가며, 기준값 위아래의 편차를 보여줄 때 유용합니다.
• Diverging range chart: Bars extend in both directions from a central reference value, useful for showing deviations above and below a benchmark.
• 누적 범위 차트: 범주당 여러 범위를 쌓아 중첩된 구간을 보여줍니다(예: 내부 50%와 외부 95% 신뢰구간).
• Stacked span chart: Multiple ranges stacked per category to show nested intervals (e.g., inner 50% and outer 95% confidence intervals).

코드 레퍼런스 / Code Reference

// Observable Plot - horizontal span chart
Plot.plot({
  marks: [
    Plot.barX(data, {
      y: "category",
      x1: "low",
      x2: "high",
      fill: "steelblue",
      tip: true
    }),
    Plot.dot(data, {
      y: "category",
      x: "median",
      fill: "white",
      stroke: "steelblue",
      r: 3
    })
  ],
  x: { label: "Value" },
  y: { label: null }
})