Google Chart Tooltip Doesn't Work

Question

I am trying to change my Google Chart Tooltip, but it doesn't work. According to the Google, I should have to put:

data.addColumn({ type: 'string', role: 'tooltip' });

and

tooltip: { isHtml: true },

But doesn't work. I am just trying to put a phrase, instead, he puts a default value.

It is my code:

  google.charts.load("current", { packages: ["corechart"] });
google.charts.setOnLoadCallback(drawChart);

function drawChart() {

    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Year');
    data.addColumn('number', 'Value');
    **data.addColumn({ type: 'string', role: 'tooltip' });**
    data.addColumn('number', 'Id');

    for (i = 0; i < Object.keys(dataDB).length; i++) {
        var year = dataDB[i].Year.toString();
        var value = (dataDB[i].Value);
        var message = "test";
        var id = (dataDB[i].Id);
        data.addRow([year, value, message, id]);
    }

    var view = new google.visualization.DataView(data);
    view.setColumns([0, 1,
                     {
                         calc: "stringify",
                         sourceColumn: 1,
                         type: "string",
                         role: "annotation"
                     }]);

    var options = {
        width: 1000,
        height: 400,
        focusTarget: 'category',
        hAxis: { textPosition: 'none' },
        legend: { position: 'none' },
        chartArea: { left: 50, top: 30, width: "70%", height: "200%" },
        bar: { groupWidth: "65%" },            
        tooltip: { isHtml: true },

    };

    var formatter = new google.visualization.NumberFormat({ decimalSymbol: ',', groupingSymbol: '.', negativeColor: 'red', negativeParens: true, prefix: 'R$ ' });
    formatter.format(data, 1);

    var chart = new google.visualization.BarChart(document.getElementById("divResult"));
    chart.draw(view, options);

    google.visualization.events.addListener(chart, 'select', function () {
        var selection = chart.getSelection();
        if (selection.length) {
            var row = selection[0].row;
            var _year = data.getValue(row, 0);
            var _id = data.getValue(row, 3);
            CallMensal(_id, _year);
        }
    });

}

Answer 1

also need to add column property

                                                  // col prop
data.addColumn({ type: 'string', role: 'tooltip', p: {html: true}});

EDIT

the column also needs to be included in the view which is used to draw the chart

include the column index when using view.setColumns

var view = new google.visualization.DataView(data);
view.setColumns([0, 1, 2, {
  calc: 'stringify',
  sourceColumn: 1,
  type: 'string',
  role: 'annotation'
}]);