É possível ter cores de plano de fundo de legenda diferentes para diferentes linhas de dados no gráfico de barras do Google, sem quebrar o gráfico?
Veja o código de exemplo:
var data = new google.visualization.DataTable();
data.addColumn('string', 'Mac');
data.addColumn('number', 'Score');
data.addColumn({ type: 'string', role: 'style' });
data.addRows([
['Mac model 12', 200, 'color: #8bba30; opacity: 0.75;'],
['Another Mac Model', 110, 'color: #ffcc33; opacity: 0.75;'],
]);
var options = {
title: '',
width: 500,
height: data.getNumberOfRows() * 40 + 100,
hAxis: {
minValue: 0,
maxValue: 255,
ticks: [0, 75, 150, 255],
textPosition: 'out',
side: 'top'
},
series: {
0: { axis: 'Mac' },
1: { axis: 'Score' }
},
chartArea: {
top: 0,
bottom: 50,
right: 50,
left: 150
},
legend: { position: 'none' },
fontSize: 12,
bar: {groupWidth: '75%'},
};
var chart = new google.visualization.BarChart(document.getElementById('apple_div'));
chart.draw(data, options);
}
Esta é a saída:
Veja, existem cores diferentes para diferentes barras. Mas eu quero cores diferentes e / ou cores de fundo para diferentes lendas no lado esquerdo.
Alguém pode me ajudar com isso, por favor?
Encontrei a seguinte resposta,É possível mostrar cada legenda em cores diferentes no gráfico de pizza do Google.
Mas sugere dividir o gráfico (ou seja, desenhar gráficos separados para cada linha), o que não é desejável, pois há um grande número de linhas.