Friends, After several hours of searching for an answer I am unable to fix my problem. I am working with latest jQuery and Google's API visualizations.
On page load, the ColumnChart renders properly. When you mouseover the bars it shows a hover-ish event being detected (highlighting of the edges - showing that mouseover is working). However, it doesn't show the tooltip box with the information.
Now when you click on the bar, the tooltip DOES appears. I never had this problem before. I thought the default for the hovering was to show the tool tip.
Any help is greatly appreciated.
Here is my .JS code:
$(document).ready(function() {
$.post('presu.php', function ( data ) {
var data = new google.visualization.DataTable(JSON.parse(data));
var view = new google.visualization.DataView(data);
view.setColumns([0,
{label: data.getColumnLabel(1),type: 'number', calc: function (dt, row) {
return {v: dt.getValue(row, 1) / 1000000, f: dt.getFormattedValue(row, 1)};
}},
{label: data.getColumnLabel(2),type: 'number', calc: function (dt, row) {
return {v: dt.getValue(row, 2) / 1000000, f: dt.getFormattedValue(row, 2)};
}},
{label: data.getColumnLabel(3),type: 'number', calc: function (dt, row) {
return {v: dt.getValue(row, 3) / 1000000, f: dt.getFormattedValue(row, 3)};
}
}]);
var columnChart = new google.visualization.ColumnChart(document.getElementById('mdo'));
columnChart.draw(view,
{title:"Cells",
width:600,
height:400,
tooltip: {isHtml: true},
isStacked:true,
legend:'bottom',
tooltip:{},
focusTarget:"category"
});
});
})
Thanks in advance.
Thanks