2

I am trying to display a bar chart with legends and labels in white, so i tried this code below on my view, but it didn't do nothing, and my continues displaying the default color.

      <%= bar_chart opfh, height: "150px", width: "450px", library: {chartArea: {top: 50,right: 50,bottom: 15,left: 130}, legend: { position: "left", labels: { fontSize: 16, backgroundColor: "none", fontColor: "#fff"} }, colors: ["#0526FF", "#FFFFFF"]} %>

Is there no way to solve this issue?

This is how my chart looks

This is how my chart looks

Edit: Thanks to @WhiteHat answer i cold resolve this! Actually i was trying to change vAxis colors instead

1 Answers1

1

assuming you're creating a BarChart from Google Charts,
see the configuration options...

for the legend, need to use --> legend.textStyle -- (not legend.labels)
and the following options do not exist...

legend.textStyle.backgroundColor
legend.textStyle.fontColor

for font color, use --> color

legend: { position: "left", textStyle: { fontSize: 16, color: "#fff"} }
WhiteHat
  • 59,912
  • 7
  • 51
  • 133
  • tried as your answered, but it still didnt do nothing – Elisson G. M. Silva Oct 29 '20 at 15:52
  • `<%= bar_chart opfh, height: "150px", width: "450px", library: {chartArea: {top: 50,right: 50,bottom: 15,left: 130}, legend: { position: "left", textStyle:{color: "#fff", fontSize: 16}}, backgroundColor: "none", colors: ["#0526FF", "#FFFFFF"]} %>` tried this, but chartkick doesnt render bar chart properly – Elisson G. M. Silva Oct 29 '20 at 15:53
  • are you referring to the labels next to the bars? that's not the legend. that would be --> `vAxis.textStyle` -- also, will you please share the link to the chart kick documentation? – WhiteHat Oct 29 '20 at 16:27