调色板是一种预先注册用于绘制网格单元格的填充及线对象等，以便在必要时提取并使用的机制。
首先，在网格上注册调色板。
grid.registerFillPalette({
name: 'f01',
fills: ['#1000ff00', '#2000ff00', '#3000ff00', '', '#4000ff00', '#5000ff00']
});
grid.registerStrokePalette({
name: 's01',
strokes: ['#ff0000', '#00ff00', '#0000ff', null]
});
如果在指定为参数的设置对象中包含"fills"数组，就会被注册为填充调色板，而如果包含"strokes"数组，就会被注册为线调色板。否则将会被忽视。 包含在数组的填充或线项目，与在GridStyles中指定相关属性值的方式相同。 空字符串、undefined、null等无法被创建为绘制对象的值，将会被指定为null对象。 通过上述方式而指定和创建的绘制对象，将会在网格渲染时点，设置在相关该区域的GridStyles。
包含在所注册的调色板中的项目，可以被设置在用于指定填充或线对象的GridStyles属性。
grid.body().setStyles({
background: 'p(f01)',
borderRight: 'p(s01)'
});
将预先注册的调色板名称指定在"p("与")"之间。 此后，将会在实际需要绘制对象的时点，向调色板提出请求，而调色板将会返回设置在当前位置值中的绘制对象，并增加一个位置值。 当位置值增加到相当于调色板项目的数量后，将会重置为0。
也就是说，如果通过上述方式指定调色板，就无法预先预测实际使用的调色板项目。 当实际颜色值并不重要，并且只需要区分区域之间时，我们可以使用这种方式。
如果因为在应用中已有决定颜色值等而需要使用调色板项目中的特殊值，就需要明确指定位置值。
colName.setStyles({
background: 'p(f01:1)'
});
colAddr.setStyles({
background: 'p(f01:2)'
});
colSalary.setStyles({
background: 'p(f01:12)'
});
使用":"而划定调色板名称后，指定项目位置值为整数。 第一项为0。 如果指定大于调色板项目的数量，就会返回相当于除以数量的余数的项目。 也就是说，当调色板项目的数量为10时，如果指定为"pal(f10:12)"，就会返回第三项。 而且，如果替代在内部逐一增加位置值的方式而将其指定为"?"，就会返回包含在调色板中的任一位置上的项目。
当返回调色板项目时，可以首先重置内部位置为特定位置。
colName.setStyles({
background: 'p(f01:7:0)'
});
指定位置并用":"划定后，再指定重置位置值。 也就是说，上述例题意味着重置调色板下一步将要返回的项目位置为0。
colAddr.setStyles({
background: 'p(f01::5)'
});
如上述例题，如果只重新设置而不指定项目位置，就会返回重置位置的项目。
通过使用项目的位置值，可以指定使用该调色板的范围可识别的变量。
grid.body().setRowStyles({
background: 'p(f01:row)'
});
例如，rowStyles是用于绘制网格数据区域的数据行的样式组。 如果将background属性指定为调色板并且将项目的位置值指定为"row"，就会返回相当于当前运行绘制的行位置值的调色板项目。 有关可使用的变量，将会在使用调色板的个别区域中进行说明。
通过这种使用方式，我们可以简化代码或只通过设置样式而灵活体现显示方式。 而且，也可以通过另行准备调色板配置并且在运行时间加载的方式而构成应用。
$(function () {
grid.loadPalettes([{
name: 'f01',
fills: ['#1000ff00', '#2000ff00', '#3000ff00', '', '#4000ff00']
}, {
name: 's01',
strokes: ['#ff0000', '#00ff00', '#0000ff', null]
}]);
});