IconCellRenderer

아이콘 렌더러

상세 설명

이미지 아이콘과 텍스트를 같이 표시한다.

url을 직접 지정하여 표시할 수도 있다.

CellRenderer 를 상속한다.

[제한 사항]

1. iconLocation = RIGHT: 텍스트가 길면 아이콘이 표시되지 않을 수 있다.

2. 자동 높이에서 TOP_EDGE, BOTTOM_EDGE를 사용할 수 없다.

[상위 클래스]

CellRenderer

예제 코드

// string type
column.renderer = 'icon';

// object type
column.renderer = {
    "type": "icon",
    "iconMap": {
        "UPQRK": "images/particles/uquark.png",
        "DOWNQRK": "images/particles/dquark.png",
        "ELECTRN": "images/particles/e.png",
        "ELECNEU": "images/particles/eneutrino.png",
    },
    "iconHeight": 11
},

프로퍼티 정보

iconField


iconField: string

아이콘 이미지 렌더링을 위해 url 값으로 읽어올 필드의 필드명

상세 설명

IconCellRenderer.iconCallback 이 할당되어 있지 않거나 false를 반환한 경우 적용된다.

예제 코드

column.renderer = {
     "type": "icon",
     "iconField": "Cats"
}

iconLocation


iconLocation: IconLocation

렌더링되는 아이콘의 위치

iconMap


iconMap: { [value: string]: string; }

셀 값과 해당 셀 값에 대응시킬 url 의 키-값 쌍

상세 설명

IconCellRenderer.iconCallback 이 할당되어 있지 않거나 false를 반환한 경우 적용된다.

예제 코드

column.renderer = {
     type: 'icon'
     iconMap: {
         value1: 'images/e_equals_mc_square.jpg'
     }
}

iconUrl


iconUrl: string

보여줄 아이콘 이미지의 url

상세 설명

IconCellRenderer.iconMap 이 설정된 경우, 해당 설정된 값은 무시된다.

spaceKey


spaceKey: boolean

true이면 스페이스바를 입력했을때 onCellItemClicked 가 호출된다.

콜백 정보

iconCallback


iconCallback: GetImageCallback

아이콘 이미지의 렌더링을 위한 콜백

상세 설명

false 반환 시 해당 콜백에 의한 렌더링이 취소된다.

GetImageCallback 의 형식을 따른다.

예제 코드

column.renderer = {
     "type": "icon",
     "iconCallback": function (grid, cell) {
         return "images/teraforming/mars.jpg";
     }
}