[Android] MPAndroidChart : x축 시간, 날짜로 변경하기
MPAndroidChart x축 시간으로 변경하기
포스팅 시점으로 최신 라이브러리인 3.1.0 버전을 사용하겠습니다.
implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0'
TimeAxisValueFormat.kt
x축을 날짜-시간 형식으로 포맷할 클래스를 만들어 해결합니다.
class TimeAxisValueFormat : IndexAxisValueFormatter() {
override fun getFormattedValue(value: Float): String {
// Float(min) -> Date
var valueToMinutes = TimeUnit.MINUTES.toMillis(value.toLong())
var timeMimutes = Date(valueToMinutes)
var formatMinutes = SimpleDateFormat("HH:mm")
return formatMinutes.format(timeMimutes)
}
}해당 클래스는 MPAndroidChart 라이브러리에서 제공하는 IndexAxisValueFormatter 클래스를 상속 받습니다.
상속받은 클래스의 getFormattedValue()로 오버라이딩 하여 원하는 형식으로 변경할 수 있습니다.
제가 그리고자 했던 그래프는 x축에 24시간을 나타내야 하기 때문에 다음과 같이 수정했습니다.
- value(Float형) : minutes → milliseconds
- milliseconds → Date형
- Date형 → SimpleDateFormat("원하는 형태")
😅 SimpleDateForamt("HH:MM")으로 하면 원하는 결과가 나오지 않아요!
이미 아시는 분들도 계시겠지만, "HH:mm"으로 해야 '시:분' 형식으로 나오게 됩니다.
"HH:MM"으로 한다면 '시:월'으로 나타나 모든 분이 1로 표시됩니다. 저는 이걸 헷갈리고 계속 헤맷답니다ㅎㅎ
날짜 형식으로 원하는 분들은 첫번째 과정에서 TimeUnit.DAYS 변경하고 SimpleDateFormat을 변경하면 되겠죠?
TimeUnit은 쉽게 시간을 계산할 수 있도록 Java에서 제공하는 라이브러리로 다음과 같은 예시를 들 수 있습니다.
TimeUnit.SECONDS.toHours()
TimeUnit.DAYS.toMinues()
TimeUnit.MILLISENDS.toSeconds()
ChartFragment.kt
val xAxis = chart.xAxis
xAxis.valueFormatter = TimeAxisValueFormat()
xAxis.setDrawLabels(true) // Label 표시 여부
xAxis.axisMinimum = -240f // 오전 5시
xAxis.axisMaximum = 1200f- valueFormatter : 위에서 정의한 Formatter 클래스
- axisMinimum : 최소값
- axisMaximum : 최대값
👆 axisMinimum을 -240f로 지정한 이유?
처음에 최소값을 0f로 지정했더니 기본 값이 오전 9시로 표시되었습니다.
저의 경우, 시작점을 오전 5시로 하고 싶었기 때문에 다음과 같이 조정하여 표시하였습니다!
reference >