Friday, 15 August 2014

javascript - Geochart map change color -



javascript - Geochart map change color -

i find configuration name everyting backgroundcolor, coloraxis, datalessregioncolor etc. want alter greenish default color.

example code:

<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 info = google.visualization.arraytodatatable([ ['country', 'popularity'], ['germany', 200], ['united states', 300], ['brazil', 400], ['canada', 500], ['france', 600], ['ru', 700] ]); var options = {}; var chart = new google.visualization.geochart(document.getelementbyid('chart_div')); chart.draw(data, options); }; </script>

the geocharts documentation provide info need do. colors configurable in var options of chart. https://developers.google.com/chart/interactive/docs/gallery/geochart#configuration_options if want alter default coloring have specify color want in colors: option. instance:

var options = { //put color hex code here colors: ['#ff0000'] //eg. reddish };

by default color info lightest shade color specified range of values of info (lowest highest). in code 200 700. can specify colors info range from. for instance, if wanted info colored greenish bluish can specify 2 colors.

var options = { //put colour hex code here colors: ['#00ff00','#0000ff'] };

you can many colors if trying demonstrate kind of difference between countries, best utilize 2 colors show progression in data. see fiddle example.

you can play around colors more of options stated above such coloraxis. documentation explains these well.

javascript google-api geomap

No comments:

Post a Comment