How to 'flip" chart of Google Charts?

Asked

Viewed 507 times

2

I have the following chart that Gero using Google Charts:

google.charts.load('current', {packages: ['corechart', 'bar']});
google.charts.setOnLoadCallback(drawStacked);
function drawStacked() {
var data = google.visualization.arrayToDataTable([
['Ativo', 'Qtd. de erros'],
<?php
   $b = 0;
   while($b < 5){
   echo "['".$tabela['Papel'][$b].", ".$tabela['usuario'][$b]."',".$tabela['Tot_papel'][$b]."],";
   $b++;
   }
   ?>
]);
var options = {
title: 'Ranking qtd. de erros por ativos',
isStacked: true,
hAxis: {
title: 'Qtd de erros',
minValue: 0,
},
vAxis: {
title: 'Ativos'
}
};
var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
chart.draw(data, options);
}

To div calling for :

<div id="chart_div" class="gogl" style="width: 600px; height: 300px"></div>

All this generates the following graph:

inserir a descrição da imagem aqui

The bars go from left to right, I wanted the graph to be the mirror of what it is now, from right to left.

javascript html css
  • 1

    Second API vAxis.direction: '-1' > https://developers.google.com/chart/interactive/docs/gallery/barchart

  • This is reversing the graph vertically, I want you to invert horizontally

  • 1

    Just indicate which axis you want to change direction. vAxis (vertical), hAxis (horizontal). Access the link I posted it explains right.

  • 1

    Aaaah got here, had not noticed the difference of the first letter, agr improved, thanks guy :D

1 answer

2


Just you assign -1 the direction of the axis you want to reverse:

vAxis.Direction or hAxis.Direction

Indicates the direction in which the values along the axis grow.

Specify -1 to invert the order of values.

Accepted values: 1 or -1

Default value: 1

Google Charts

To reverse vertically:

vAxis.direction: '-1'

To invert horizontally:

hAxis.direction: '-1'

Browser other questions tagged javascript html css

You are not signed in. Login or sign up in order to post.