성과/목표 렌더러

각각 두 개의 데이터 필드에 저장된 목표값(혹은 기대값)과 실행값을 비교하여 표시하는 시리즈 렌더러들입니다. ActualTargetBulletRenderer, ActualTargetTextRenderer와 같은 타입들이 있으며, 데이터의 내용에 맞게 적절한 타입을 선택해야 합니다.

 
 
var columns = [
    .. 생략 ..
    {
        width: 400,
        name: 'colBullet',
        type: 'series',
        fieldNames: 'target,actual',
        height: 30,
        renderer: {
            type: 'actualtargetbullet',
        },
        header: {
            text: 'Bullet',
        },
        styleCallback: (grid, model) => {
            const ret = {}
            const [target, actual] = model.value;
 
            if (target < actual) {
                ret.renderer = {
                    actualStyle: 'fill-green'
                }
            } else {
                ret.renderer = {
                    actualStyle: 'fill-red'
                }
            }
 
            return ret;
        },
    },
    {
        width: 400,
        name: 'colText',
        type: 'series',
        fieldNames: 'target,actual',
        renderer: {
            type: 'actualtargettext',
        },
        header: {
            text: 'Text',
        },
    },
]

링크 렌더러 HTML 렌더러