style the tool tip/keep certain data off the tool tip in geo chart visualization

247 views
Skip to first unread message

J

unread,
Dec 8, 2011, 10:22:09 PM12/8/11
to Google Visualization API

Hi,
Love the new features in the geo chart. I'm looking at some of the
new features now and

wondering how I could use the tooltip object or some other new feature
to hide my second column

of datay from the tool tip.
Here's the chart:
http://www.auburn.edu/~jpw0011/stu_map.php

It calls external data from a spreadsheet in google docs, and so far
I've been unable to find any

documentation dealing with querying external data and reformatting how
the data will appear on

the tool tip. I just want the country name to appear, not the "1" I'm
only using as a means to

change the default color of the highlighted countries.

How can I hide the ": 1" and keep it off the tool tip?

THanks

Here's the code from the link above:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta charset="utf-8" />
<script type='text/javascript' src='https://www.google.com/jsapi'></
script>
<script type='text/javascript'>
google.load('visualization', '1', {'packages': ['geochart']});
google.setOnLoadCallback(drawRegionsMap);

function drawRegionsMap() {
var query = new google.visualization.Query(
'https://docs.google.com/spreadsheet/tq?key=0Ah2-

ECiQ9qQBdEYyc25RWjdrbzRieXVEQmhkZ0tWalE&headers=0');

// Send the query with a callback function.
query.send(handleQueryResponse);
}

function handleQueryResponse(response) {
if (response.isError()) {
alert('Error in query: ' + response.getMessage() + ' ' +
response.getDetailedMessage());
return;
}

var data = response.getDataTable();

var options = {};
options['region'] = 'world';
options['resolution'] = 'countries';
options['width'] = 700;
options['height'] = 300;
options['colors'] = ['#f1f1f1','#03244d'];
options['legend'] = 'none';

var container = document.getElementById('map_canvas');
var geochart = new google.visualization.GeoChart(container);
geochart.draw(data, options);
};
</script>
</head>

<body>
<div id='map_canvas'></div>
</body>

</html>

​

asgallant

unread,
Dec 9, 2011, 9:36:34 AM12/9/11
to google-visua...@googlegroups.com
You can use the new 'tooltip' column role to adjust the tooltips to your liking.  I copied your code, then built a view based on your data with a calculated tooltip column and drew the chart with the view: http://jsfiddle.net/ymfZY/

J

unread,
Dec 9, 2011, 10:21:00 AM12/9/11
to Google Visualization API
Anyone have any ideas on how to do this? Keep a column of data from
appearing on the tool tip? I've wondered about two possibilities, one
involves the new tooltip object and the options that may be there, and
the other possibility involves adding a third column to my data table
that repeats the first column of country names and then assigns that
third column the role of annotation text, but I haven't found any
documentation that deals with assigning roles to columns of data while
using external data. Any thoughts on any of this? Your help is
earnestly solicited and will be immensely appreciated. THanks.
J

J

unread,
Dec 9, 2011, 10:59:43 AM12/9/11
to Google Visualization API
Wow, thanks. I didn't see your reply until after I posted my second
message. Thanks so much, I'm about go try that out. Thank you!

J

Ben

unread,
Dec 9, 2011, 11:09:39 AM12/9/11
to Google Visualization API
Thanks for the example.

On Dec 9, 8:36 am, asgallant <drew_gall...@abtassoc.com> wrote:

Reply all
Reply to author
Forward
0 new messages