ok I found what problem is... I have to add a new view.setColumns to get
color value as the second column like view.setColumns([0,6,{.. and make a
color function from that view
On Sunday, March 26, 2017 at 1:21:57 PM UTC+7, Patcharapan Tantichotkiat
wrote:
>
> I found the code to assign color to each countries from this forum How to
> assign colour to each countries based on a given set of values
> <http://stackoverflow.com/questions/35720295/how-to-assign-colour-to-each-countries-based-on-a-given-set-of-values>
> and
> adapted to mine but I got an error (maybe it's simple but pls correct my
> code for me because I'm new for all of this coding)
>
> Uncaught ReferenceError: row is not defined at
> Function.handleQueryResponseTR (testGmap2.html:71) at gvjs_Cn.gvjs_.HC
> (format+th,default+th,ui+th,geochart+th.I.js:377) at Function.gvjs_Jn [as
> setResponse] (format+th,default+th,ui+th,geochart+th.I.js:369) at
> tq?tqx=reqId%3A0:2
>
> and my data in google sheet look like this [image: enter image
> description here] <https://i.stack.imgur.com/7rJwU.png>
>
>
>
>
> This is my code (I want to take values from google sheet[colors column in
> pic below] and define color in if condition)
>
> <script type='text/javascript'
> src='http://www.google.com/jsapi'></script><script
> type='text/javascript'>google.load('visualization', '1', {'packages':
> ['geochart']});
> google.setOnLoadCallback(drawVisualization);
>
> function drawVisualization()
> {
> var query = new
> google.visualization.Query('https://docs.google.com/spreadsheets/d/1dTfxVvfDKn6iXn4W_m7HJ_86JOGNDsxYSSaXipEo0vM/edit#gid=0');
> // query.setQuery('select A,B,C');
> query.send(handleQueryResponseTR);
> }function handleQueryResponseTR(response) {
> if (response.isError()) {
> alert('Error in query: ' +
> response.getMessage() + ' ' + response.getDetailedMessage());
> return;
> }
>
> var options = {
> //color
> colorAxis: {colors: colorNames,
> values: colorValues},
>
> backgroundColor: {fill:'#FFFFFF',stroke:'#FFFFFF' ,strokeWidth:0 },
> datalessRegionColor: '#F5F0E7',
> displayMode: 'regions',
> enableRegionInteractivity: 'true',
> resolution: 'countries',
> region:'world',
> keepAspectRatio: true,
> width:800,
> height:600,
> tooltip: {isHtml:'true',textStyle: {color: '#444444'}, }
> };
>
>
> var data = response.getDataTable();
> var view = new google.visualization.DataView(data);
>
> //get data to show on tooltips
> view.setColumns([0,{
> type:'string',
> label : 'dataname',
> calc: function (dt, row) {
> var dt1 = dt.getFormattedValue(row, 1)
> var dt2 = dt.getFormattedValue(row, 2)
> var url = dt.getFormattedValue(row, 4)
> var image = dt.getFormattedValue(row, 5)
>
> return dt1 + ' : ' + dt2
> },
> role: 'tooltip',
> p: {html: true}
>
> }]);
>
>
> var chart = new
> google.visualization.GeoChart(document.getElementById('visualization'));
>
> //clickable url
> google.visualization.events.addListener(chart, 'select', function () {
> var selection = chart.getSelection();
> if (selection.length > 0) {
> //console.log(data.getValue(selection[0].row, 4));
> window.open(data.getValue(selection[0].row, 4));
> }
> });
>
>
>
> // color values
> var colorValues = data.getValue(row,6);
>
>
>
>
> // build color names
> var colorNames = [];
> colorValues.forEach(function(value) {
> if (value = 1) {
> colorNames.push('red');
> } else if ((value > 1) && (value <= 4)) {
> colorNames.push('yellow');
> } else {
> colorNames.push('green');
> }
> });
>
>
> chart.draw(view, options);
> }
> </script>
> <div id='visualization'></div>
>
>
--
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 https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit
https://groups.google.com/d/msgid/google-visualization-api/f663d0f7-0fe4-4528-91d6-b22c96d831d3%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
