Hi Aguinaldo,
Yes, that is the recommended way for coloring each bar a unique color. The
reason for this is that the coloring mode of a column chart is
series-based. This means that each column gets its own color. So really,
you have two options:
1. Have a column for each datum (which would require an NxN data table
where N is the amount of data), plus you would have to render it as
stacked, since otherwise each datum will be unevenly positioned.
2. Assign each datum a color using the style role (as you mentioned in
your post).
On Fri, Nov 27, 2015 at 9:29 PM Aguinaldo Aranda <
aguinaldoara...@hotmail.com> wrote:
>
> Hello guys!
>
> I have a column chart and would like to make each column of a color.
>
> This is my js code:
>
> <script>
> google.load('visualization', '1', {packages: ['corechart', 'bar']});
> google.setOnLoadCallback(drawBasic);
>
> function drawBasic() {
>
> var dados = $.ajax({
> url: "teste_aguinaldo.php",
> dataType: "json",
> async: false
> }).responseText;
>
> var data = google.visualization.arrayToDataTable($.parseJSON(dados));
>
> var options = {
> // title: 'Motivation Level Throughout the Day',
> colors: ['#ff0066','#00ff00','#eee'], //this line does not work,
> just use the first color
> legend: { position: 'none' },
> animation:{
> duration: 1000,
> easing: 'inAndOut',
> startup: true
> },
> hAxis: {
> // title: 'Time of Day',
> },
> vAxis: {
> //title: 'Rating (scale of 1-10)'
> }
> };
>
> var chart = new google.visualization.ColumnChart(
> document.getElementById('chart_div'));
>
> chart.draw(data, options);
> }
>
> </script>
>
>
> This is the program that generates the PHP JSON
>
> <?php
>
>
> $Query = "SELECT usuarios.* FROM usuarios where usuarios.id_cliente =
> '".$_SESSION['id_cliente']."' ";
>
> $resultado = mysql_query($Query);
> $linhas = mysql_num_rows($resultado);
>
> if($linhas!=0 ):
>
> $dados[0] = array("Tipo","Qtde");
>
> while ($dados = mysql_fetch_array($resultado)) {
>
> $id_promotor = $dados['id_usuario'];
>
> $ConheceTrabalha = Conhece_Trabalha($id_promotor);
> $ConheceTrabalha_tot = $ConheceTrabalha_tot + $ConheceTrabalha;
>
> $ConhecenaoTrabalha = Conhece_nao_Trabalha($id_promotor);
> $ConhecenaoTrabalha_tot = $ConhecenaoTrabalha_tot +
> $ConhecenaoTrabalha;
>
> $NaoConhece = Nao_Conhece($id_promotor);
> $NaoConhece_tot = $NaoConhece_tot + $NaoConhece;
>
> } // fim while
>
>
> $dados[1] = array("Ativos",(int)$ConheceTrabalha_tot);
> $dados[2] = array("Em transição",(int)$ConhecenaoTrabalha_tot);
> $dados[3] = array("Desconheciam",(int)$NaoConhece_tot);
>
> echo json_encode($dados);
>
> endif;
>
> ?>
>
>
>
> This is the json return:
>
> [["Tipo","Qtde"],["Ativos",183],["Em
> transi\u00e7\u00e3o",106],["Desconheciam",53]]
>
>
> How do I add different colors for each column?
>
> Already researched a lot and every reference I find is like this:
>
> var data = google.visualization.arrayToDataTable([
> ['Element', 'Density', *{ role: 'style' }*],
> ['Copper', 8.94, *'#b87333'*], // RGB value
> ['Silver', 10.49, *'silver'*], // English color name
> ['Gold', 19.30, *'gold'*],
>
> ['Platinum', 21.45, *'color: #e5e4e2'* ], // CSS-style declaration
> ]);
>
>
> Thank you and sorry for English
>
> --
> You received this message because you are subscribed to the Google Groups
> "Google Chart API" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to google-chart-api+unsubscr...@googlegroups.com.
> To post to this group, send email to google-chart-api@googlegroups.com.
> Visit this group at http://groups.google.com/group/google-chart-api.
> For more options, visit https://groups.google.com/d/optout.
>
--
[image: unnamed.gif]
•
•
•
•
Sergey Grabkovsky
Software Engineer
Google, Inc
gra...@google.com
--
You received this message because you are subscribed to the Google Groups
"Google Chart API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to google-chart-api+unsubscr...@googlegroups.com.
To post to this group, send email to google-chart-api@googlegroups.com.
Visit this group at http://groups.google.com/group/google-chart-api.
For more options, visit https://groups.google.com/d/optout.
