Annotation Color Only Shows When Text Outside Of Google Bar Chart

I have a google bar chart and I am setting the font size and the color, however the color only applies when the text is outside of the bar. How do I force the color to apply? an

Solution 1:

turn off annotations.highContrast

from the documentation...

annotations.highContrast lets you override Google Charts choice of the annotation color. By default, annotations.highContrast is true, which causes Charts to select an annotation color with good contrast: light colors on dark backgrounds, and dark on light. If you set annotations.highContrast to false and don't specify your own annotation color, Google Charts will use the default series color for the annotation:

see following example, note the use of textStyle.auraColor

google.charts.load('current', {
  callback: function () {
    new google.visualization.ColumnChart(document.getElementById('chart_div')).draw(
      google.visualization.arrayToDataTable([
        ['Element', 'Density', { role: 'annotation' } ],
        ['Copper', 8.94, 'Cu' ],
        ['Silver', 10.49, 'Ag' ],
        ['Gold', 19.30, 'Au' ],
        ['Platinum', 21.45, 'Pt' ]
      ]),
      {
        annotations: {
          highContrast: false,
          textStyle: {
            auraColor: 'lime',
            color: '#000000',
            fontSize: 18
          }
        },
        colors: ['lime']
      }
    );
  },
  packages: ['corechart']
});

<scriptsrc="https://www.gstatic.com/charts/loader.js"></script><divid="chart_div"></div>

another option might be annotations.alwaysOutside