您可以使用Ag-Grid的cellRenderer来自定义单元格的渲染，并结合Bootstrap的工具提示添加工具提示效果。以下是一个示例代码：

首先，您需要在HTML文件中引入Ag-Grid和Bootstrap的相关文件：

然后，在JavaScript文件（例如main.js）中，您可以使用cellRenderer来自定义渲染单元格的方式，并在单元格内添加Bootstrap的工具提示：

// 设置用于渲染的单元格的render函数
function tooltipCellRenderer(params) {
    var span = document.createElement('span');
    span.innerHTML = params.value;

    // 添加Bootstrap tooltip
    span.setAttribute('data-toggle', 'tooltip');
    span.setAttribute('data-placement', 'bottom');
    span.setAttribute('title', '这是一个工具提示');

    return span;
}

// 设置Ag-Grid的列定义
var columnDefs = [
    { headerName: "姓名", field: "name", cellRenderer: tooltipCellRenderer },
    { headerName: "年龄", field: "age", cellRenderer: tooltipCellRenderer },
    { headerName: "性别", field: "gender", cellRenderer: tooltipCellRenderer }
];

// 设置Ag-Grid的数据
var rowData = [
    { name: "张三", age: 20, gender: "男" },
    { name: "李四", age: 25, gender: "女" },
    { name: "王五", age: 30, gender: "男" }
];

// 创建Ag-Grid实例并将其绑定到页面上的元素
var gridOptions = {
    columnDefs: columnDefs,
    rowData: rowData
};

// 初始化Ag-Grid
var gridDiv = document.querySelector('#myGrid');
new agGrid.Grid(gridDiv, gridOptions);

// 激活Bootstrap的工具提示
$(function () {
    $('[data-toggle="tooltip"]').tooltip()
});

在上面的示例中，我们定义了一个名为tooltipCellRenderer的函数作为cellRenderer的渲染函数。该函数会创建一个span元素，并将单元格的值设置为span的innerHTML。然后，我们使用Bootstrap的data-toggle、data-placement和title属性将工具提示添加到span元素中。

最后，我们使用Ag-Grid的columnDefs和rowData来设置列定义和数据，并将Ag-Grid绑定到页面上的元素。然后，我们使用jQuery的$(function () {})来激活Bootstrap的工具提示。

这样，当您在单元格中悬停时，将显示一个带有工具提示的工具提示框，显示为Bootstrap样式。