Highcharts는 JavaScript 기반의 강력한 차트 라이브러리입니다. 이 라이브러리를 사용하여 다양한 유형의 차트를 만들고 커스터마이징할 수 있습니다.

이번 블로그 포스트에서는 Highcharts에서 차트 축에 대한 레이블을 설정하는 방법에 대해 알아보겠습니다.

x 축 레이블 설정하기

Highcharts에서 x 축에 대한 레이블을 설정하는 방법은 매우 간단합니다. xAxis 객체의 title 속성을 사용하여 레이블 텍스트를 설정할 수 있습니다. 예를 들어, x 축에 ‘월’을 나타내는 레이블을 설정하려면 다음과 같이 코드를 작성할 수 있습니다:

xAxis: {
  title: {
    text: '월'
  }
}

y 축 레이블 설정하기

y 축에 대한 레이블을 설정하는 방법도 x 축과 유사합니다. yAxis 객체의 title 속성을 사용하여 레이블을 설정할 수 있습니다. 예를 들어, y 축에 ‘판매량’을 나타내는 레이블을 설정하려면 다음과 같은 코드를 사용할 수 있습니다:

yAxis: {
  title: {
    text: '판매량'
  }
}

축 레이블 스타일 설정하기

축 레이블의 스타일을 변경하려면 xAxis.labels 및 yAxis.labels 객체를 사용할 수 있습니다. 예를 들어, 축 레이블의 글꼴 크기를 12px로 설정하고 글꼴 색상을 빨간색으로 설정하려면 다음과 같이 코드를 작성할 수 있습니다:

xAxis: {
  labels: {
    style: {
      fontSize: '12px',
      color: 'red'
    }
  }
}

yAxis: {
  labels: {
    style: {
      fontSize: '12px',
      color: 'red'
    }
  }
}

결론

Highcharts에서 차트 축에 대한 레이블을 설정하는 방법에 대해 알아보았습니다. 이를 통해 사용자 정의 차트를 만들고 시각화된 데이터를 더 잘 이해할 수 있습니다. 추가로 Highcharts의 다양한 기능과 옵션을 살펴보면 더욱 많은 가능성을 찾을 수 있습니다.

더 많은 정보를 원하신다면, Highcharts 공식 문서를 참고해보세요.