RealGrid2 API
Interface
IconCellRenderer

IconCellRenderer

icon renderer

Signature:

export interface IconCellRenderer extends CellRenderer

Extends: CellRenderer

Remarks

Display the image icon and text together.

You can also display by directly specifying the url.

Inherits CellRenderer.

[Restrictions]

  1. iconLocation = RIGHT: If the text is long, the icon may not be displayed.

  2. TOP_EDGE and BOTTOM_EDGE cannot be used in auto height.

[Superclass]

CellRenderer

Example

//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
},

Events

PropertyTypeDescription
iconCallbackGetImageCallbackCallback for rendering icon image
titleCallbackGetCellTitleCallbackCallback to set alt text of image

Properties

PropertyTypeDescription
enterKeybooleanIf true, onCellItemClicked is executed when enterKey is entered.
exportImagebooleanIf true, the image is exported to Excel.
iconFieldstringField name of the field to be read as a url value for icon image rendering
iconLocationIconLocationPosition of the icon being rendered
iconMap{ [value: string]: string; }Key-value pair of cell value and url to correspond to that cell value
iconUrlstringURL of the icon image to show
spaceKeybooleanIf true, onCellItemClicked is executed when the space bar is entered.
type"icon"Type: Icon

Events Desc

iconCallback

Callback for rendering icon images

Type - GetImageCallback

Remarks:

When undefined is returned, rendering by the corresponding callback is canceled.

It follows the format of GetImageCallback.

Example:

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

titleCallback

Callback to set alt text of image

Type - GetCellTitleCallback

Remarks:

It should return the alt text to be set.

It follows the format of GetCellTitleCallback.

Example:

const f = function(grid, model) {
 return 'cat image'
}
column.renderer = {
 type: 'icon',
 titleCallback: f
}

Properties Desc

enterKey

If true, onCellItemClicked is executed when enterKey is entered.

Type - boolean


exportImage

If true, the image is exported to Excel.

Type - boolean

Remarks:

If GridExportOptions.exportImage is false, it is not output.


iconField

Field name of the field to be read as a url value for icon image rendering

Type - string

Remarks:

Applies when IconCellRenderer.iconCallback is not assigned or returns undefined.

Example:

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

iconLocation

Position of icon rendered

Type - IconLocation


iconMap

Key-value pair of cell value and url to correspond to that cell value

Type - { [value: string]: string; }

Remarks:

Applies when IconCellRenderer.iconCallback is not assigned or returns undefined.

Example:

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

iconUrl

URL of the icon image to show

Type - string

Remarks:

If IconCellRenderer.iconMap is set, the set value is ignored.


spaceKey

If true, onCellItemClicked is executed when the space bar is entered.

Type - boolean


type

Category: Icon

Type - "icon"