CODEWITHSUNDEEP
javascriptchartsgoogle-visualization
General Chad
General Chad

Reputation: 465

How can I change the label color on a google chart API bar chart?

I had an image that perfectly shows what my issue is but I don't have enough points to post it.

Basically, I have a bar chart using Google's API and I want to color the labels BLACK whenever they're outside the bar. Currently they are the same color as the bar and that is difficult to read. Several things are variables because I have multiple charts and I want them to look consistent in terms of fonts, weights, etc.,

 options = {
    chartArea: { width: '70%' },
    tooltip: { textStyle: { fontSize: intFontSizeAnnotation } },
    title: '',
    vAxis: { title: '', textStyle: { fontName: default_font, fontSize: intFontSizeAxis }, titleTextStyle: { fontName: default_font, fontSize: intFontSizeTitle }, gridlines: { color: 'transparent' }, label: { color: '#000000' } },
    hAxis: {
        textStyle: { fontName: default_font, fontSize: intFontSizeAxis }, titleTextStyle: { fontName: default_font, fontSize: intFontSizeTitle },
        minValue: min_overall_mpg_initMPGMake, maxValue: max_overall_mpg_initMPGMake, format: '0.00', title: 'Overall MPG', label: {color: '#000000'}
    },
    legend: 'none',
    backgroundColor: 'transparent',
    annotations: { textStyle: { fontName: default_font, fontSize: intFontSizeAnnotation, color: '#000000' } },
    tooltip: { textStyle: { fontName: default_font, fontSize: intFontSizeTitle } }
};

mpg_make_data.unshift(['Type', 'MPG', { type: 'string', role: 'annotation' }, { role: 'style' }]);

drawChart('mpg-make', 'bar', mpg_make_data, options, 'mpg');

Upvotes: 0

Views: 1269

Answers (1)

Ajai Krishna
Ajai Krishna

Reputation: 26

You can use this titleTextStyle: { color: '#a34f8b' }

Upvotes: 1

Related Questions