You can add a calculated "tooltip" column to the view for the LineChart
that includes whatever data you need:
var pie = new google.visualization.ChartWrapper({
'chartType': 'LineChart',
'containerId': 'PieChartContainer',
'options': {
'width': 950,
'height': 450,
'legend': 'right',
'title': chartTitle,
'chartArea': { 'left': 100, 'top': 100, 'right': 0, 'bottom': 100 },
'tooltip': {isHtml: true}
},
'view': {
'columns': [4, 1, {
type: 'string',
role: 'tooltip',
calc: function (dt, row) {
return 'Column 0: ' + dt.getValue(row, 0) + ', Column 1: '
+ + dt.getValue(row, 1) + ', Column 3: ' + + dt.getValue(row, 3);
}
}]
}
});
The string returned by the "calc" function can be anything you want;
whatever you return there shows up in the tooltips.
On Monday, March 24, 2014 8:28:12 AM UTC-4, Missy wrote:
>
> I am writing to query, if its possible to add more information to the
> tooltip function, so it displays details such as name, price and date.
> With, the following code below, when i hover over the line chart point, i
> can only see data from column 4 and 1:
>
> function drawVisualization(dataValues, chartTitle, columnNames,
> categoryCaption) {
> if (dataValues.length < 1)
> return;
> var data = new google.visualization.DataTable();
> data.addColumn('string', columnNames.split(',')[0]);
> data.addColumn('number', columnNames.split(',')[1]);
> data.addColumn('string', columnNames.split(',')[2]);
> data.addColumn('datetime', columnNames.split(',')[3]);
> data.addColumn('number', columnNames.split(',')[4]);
>
> for (var i = 0; i < dataValues.length; i++) {
>
> var date = new Date(parseInt(dataValues[i].Date.substr(6),
> 10));
> data.addRow([dataValues[i].ColumnName, dataValues[i].Value,
> dataValues[i].Type, date, dataValues[i].ID]);
> }
> // Define a Line chart
> var pie = new google.visualization.ChartWrapper({
> 'chartType': 'LineChart',
> 'containerId': 'PieChartContainer',
> 'options': {
> 'width': 950,
> 'height': 450,
> 'legend': 'right',
> 'chartView': { 'columns': [4, 1] },
> 'title': chartTitle,
> 'chartArea': { 'left': 100, 'top': 100, 'right': 0,
> 'bottom': 100 },
>
> 'tooltip': {isHtml: true}
> },
> 'view': { 'columns': [4, 1] }
> });
>
> My output desire is to display columns 0, 3 and 1 of data, when hovering
> over the points on the line charts.
>
> Any suggestions would be most welcomed.
>
> Many thanks.
>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/d/optout.
