문서 › 차트 종류

인구 피라미드

두 시리즈를 가운데 축에서 좌우로 마주 보게: 성별·연령 분포.

type: 'pyramid' 는 첫 번째 시리즈를 왼쪽, 두 번째 시리즈를 오른쪽으로 그립니다. 값은 양수 그대로 넘기면 되고(음수로 바꿀 필요 없음), 양쪽 축 눈금도 절댓값(2,000명)으로 적힙니다. 축은 0을 가운데 두고 좌우 대칭입니다.

움직이는 예제

이 예제의 코드

createChart('#chart', {
  type: 'pyramid',
  title: '연령대별 인구',
  subtitle: '예시 데이터',
  unit: '명',
  data: {
    labels: ['0~9세', '10대', '20대', '30대', '40대', '50대', '60대', '70대', '80세 이상'],
    series: [
      { name: '남', data: [1810, 2240, 2620, 3050, 3920, 4210, 3880, 2650, 1320] },
      { name: '여', data: [1720, 2110, 2480, 2930, 3810, 4260, 4120, 3190, 2280] },
    ],
  },
});

라벨은 어린 연령대부터 넘기세요. 첫 라벨이 맨 아래에 옵니다(yAxis.reverse 의 기본값이 피라미드에서는 true). 위에서부터 그리려면 yAxis: { reverse: false }.
툴팁은 그 연령대의 두 값과 합계를 함께 보여 줍니다. 위·아래 화살표 키로 연령대를 옮겨 다닙니다.
세 번째 시리즈부터는 그리지 않습니다. 범례(시리즈 2개)로 한쪽을 끌 수 있습니다.

비율로 보기

pyramid: { percent: true } 면 막대와 눈금이 전체 인구(양쪽 합) 대비 비율입니다. 툴팁에는 원래 인원과 비율이 함께 나옵니다. dataLabels: true 는 막대 끝에 값을 적습니다.

움직이는 예제

이 예제의 코드

createChart('#chart', {
  type: 'pyramid',
  title: '연령대별 인구 비율',
  pyramid: { percent: true },
  dataLabels: true,
  unit: '명',
  data: {
    labels: ['0~19세', '20~39세', '40~59세', '60~79세', '80세 이상'],
    series: [
      { name: '남', data: [4050, 5670, 8130, 6530, 1320] },
      { name: '여', data: [3830, 5410, 8070, 7310, 2280] },
    ],
  },
});

옵션	기본값	설명
`pyramid.percent`	false	막대·눈금·라벨을 전체 대비 비율(%)로
`yAxis.reverse`	true	첫 라벨을 아래에. false 면 위에서부터
`dataLabels`	false	막대 끝에 값(왼쪽 막대는 왼쪽 끝)
`colors`	파랑·주황	두 시리즈 색. 성별을 색으로만 구분하지 않도록 범례가 함께 나옴