[kendo ui] Y축 값이 1 이하일땐 소수점 이상일땐 자연수, 천단위 콤마

Y축 라벨  데이터가 1 이하일땐 소수점표기 

이상일땐 자연수, 천단위 콤마찍도록 하는 방법

켄도 UI의 차트를 하다 보면 여러가지 부가기능 및 옵션설정을 해주어야 하는 부분이 많다.

뭐 가장 많이 쓰이는 것이 차트와 그리드인데

차트를 구현하다 보니 값이 0.5 같은 1 이하값이 들어오는 경우에

Y축 라벨링이

0 0 0 1 1 1 이런식으로 나타나는 경우가 있다.

그렇다고 템플릿에 

  valueAxis: {
            labels: {
                format: "{0:#.##}"
            }
        },

이런식으로 작성하는 경우엔 값이 100이든 1000이든

Y축 라벨링은 100.00 200.00  이런식으로 소수점이 고정으로 들어가게 되버린다.

그래서 여기저기 찾아보고 삽질을 하다가

템플릿에 IF문을 사용할 수 있으니 값이 2 이하일때만 소수점으로 나오게 하고 

그 이상인 경우엔 자연수로 나오도록 하는 방법을

사용하면 되겠다 싶어 테스트 해보니 성공적으로 나오게 된다.

valueAxis: {
            labels: {
                template:kendo.template("#if (value == null || value < 2) {# #= kendo.format('{0:N1}', value) # #} else {# #= kendo.format('{0:N0}', value) # #}#"),
            }
        },

템플릿 양식이 좀 길어지긴 하지만 성공적으로 나온다.

이렇게 값이 없거나 작으면 소수점으로

값이 커지면 자연수에 천단위 콤마까지

Y축 라벨에 천단위 콤마찍는건

포맷을 {0:N0}

이렇게 지정해 놓으면 된다