The GeoChart colors regions by value, so you have to assign values to each
country, and then build the "colorAxis" option to match the values. As an
example, if you had 4 countries with the values 1, 2, 3, 4 that you want
colored green, blue, yellow, and red, then you would build your options
like this:
colorAxis: {
colors: ['green', 'blue', 'yellow', 'red'],
minValue: 1,
maxValue: 4
}
The color axis assigns the first color to the minValue and the last color
to the maxValue, then assigns all colors in between to equal increments
from minValue to maxValue, and interpolates colors for values that fall in
between the assigned colors (as an example, if you had a country with a
value of 3.5, it would be assigned an orange color, interpolated between
yellow and red).
On Friday, January 17, 2014 5:01:04 PM UTC-5, Kurt Heiss wrote:
>
> Hi-
>
> I am trying to color code countries in a world map but not having any
> success to date.
>
> I have assigned POCs to specific countries and then would like to color
> code by region.
>
> I am using the following code:
>
> <html>
> <head>
> <script type='text/javascript' src='https://www.google.com/jsapi'></
> script>
> <script type='text/javascript'>
> google.load('visualization', '1', {packages:['corechart']});
> google.setOnLoadCallback(drawRegionsMap);
> function drawRegionsMap() {
> var data = google.visualization.arrayToDataTable([
> ['Country', 'Manager'],
> ['Argentina', 'Alexis'],
> ['Austrailia', 'Kit'],
> ['Austria', 'Alexis'],
> ['Belgium', 'Alexis'],
> ['Brazil', 'Alexis'],
> ['Canada', 'Alexis'],
> ['Chile', 'Alexis'],
> ['China', 'Kit'],
> ['Colombia', 'Alexis'],
> ['Croatia', 'Alexis'],
> ['Czech Republic', 'Alexis'],
> ['Denmark', 'Alexis'],
> ['Egypt', 'Alexis'],
> ['United States', 'Kit'],
> ['Japan', 'Kit'],
> ['RU', 'Alexis']
> ])
>
> var options = {
> region: 002, 150, 019, 142
> displayMode: 'regions',
> colorAxis: {colors: ['green', 'blue', 'yellow', 'red']},
> datalessRegionColor: 'E5E4E2',
> resolution: 'Country'
> };
>
> var chart = new google.visualization.GeoChart(document.
> getElementById('chart_div'));
> chart.draw(data, options);
> };
> </script>
> </head>
> <body>
> <div id="chart_div" style="width: 1000px; height: 600px;"></div>
> </body>
> </html>
>
> Please advise.
>
> Regards,
> Kurt
>
--
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/groups/opt_out.
