要实现Ag Grid的单元格颜色动态变化，可以使用Ag Grid的cellClassRules属性。cellClassRules属性允许根据特定的条件为单元格指定一个或多个CSS类。

以下是一个示例代码，演示如何根据单元格的值动态更改其颜色：

// 定义单元格颜色动态变化的规则
var cellClassRules = {
  'red-cell': function(params) {
    // 根据条件返回是否应该应用红色背景色的布尔值
    return params.value > 10;
  },
  'green-cell': function(params) {
    // 根据条件返回是否应该应用绿色背景色的布尔值
    return params.value <= 10;
  }
};

// 定义Ag Grid的列定义
var columnDefs = [
  { headerName: '值', field: 'value', cellClassRules: cellClassRules }
];

// 定义Ag Grid的行数据
var rowData = [
  { value: 5 },
  { value: 15 },
  { value: 8 },
  { value: 12 }
];

// 创建Ag Grid实例
var gridOptions = {
  columnDefs: columnDefs,
  rowData: rowData
};

// 将Ag Grid实例绑定到DOM元素上
var gridDiv = document.querySelector('#myGrid');
new agGrid.Grid(gridDiv, gridOptions);

在上面的示例中，我们定义了两个cellClassRules，一个用于将值大于10的单元格背景色设置为红色，另一个用于将值小于等于10的单元格背景色设置为绿色。然后，将这些规则应用到了Ag Grid的列定义中。

注意，这里的'red-cell'和'green-cell'是自定义的CSS类，你可以在CSS中定义它们的样式。例如：

.red-cell {
  background-color: red;
}

.green-cell {
  background-color: green;
}

这样就可以动态地根据单元格的值来更改其颜色了。