# IconColumn
Show ICON using Web Font.
Number of ICONs can be set at field.
TIP
When showing ICON to ordinal column, please refer to here
<div class="sample1 demo-grid small"></div>
1
ICON in sample uses Material icons (opens new window)
<!-- Material Icons: https://material.io/icons/ --> <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/icon?family=Material+Icons" />
1
2
3
4
5
6
const grid = new cheetahGrid.ListGrid({
parentElement: document.querySelector(".sample1"),
header: [
{
field: "value",
caption: "value",
width: 100,
},
{
field: "value",
caption: "icon",
width: 130,
columnType: new cheetahGrid.columns.type.IconColumn({
className: "material-icons",
content: "\uE885", // https://material.io/icons/#ic_grade
}),
style: {
color: "gold",
},
},
],
});
grid.records = [
{ value: 1 },
{ value: 2 },
{ value: 3 },
{ value: 4 },
{ value: 5 },
];
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29