hi all
I am creating material line chart with google charts
I want to change the information in the tooltip that gets visible when you hover any pointer.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['line']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('number', 'Visits');
data.addColumn('number', 'Hours');
data.addColumn({type: 'string', role: 'tooltip'});
data.addRows([
[1, 04,'1 visits at 04 hours'],
[3, 08,'3 visits at 08 hours'],
[4, 07,'4 visits at 07 hours'],
[5, 01,'5 visits at 01 hours'],
[6, 06,'6 visits at 06 hours'],
]);
var options = {
chart: {
title: 'User Sessions hourly',
subtitle: ''
},
width: 900,
height: 300
};
var chart = new google.charts.Line(document.getElementById('linechart_material'));
chart.draw(data, options);
}
</script>
<div id="linechart_material"></div>
</body>
</html>
i want to modify the information in the tooltip when you hover over pointer.
In the docs they say we should use
data.addColumn({type: 'string', role: 'tooltip'});
I tried it but the tooltip content is not changing.
vineet