根据值更改甘特图中的条形颜色

google.charts.load('current', {
  callback: drawChart,
  packages: ['gantt']
});

function drawChart() {
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'Task ID');
  data.addColumn('string', 'Task Name');
  data.addColumn('string', 'Resource');
  data.addColumn('date', 'Start Date');
  data.addColumn('date', 'End Date');
  data.addColumn('number', 'Duration');
  data.addColumn('number', 'Percent done');
  data.addColumn('string', 'Dependencies');

  data.addRows([

  ['C10', 'C10', 'Xa', new Date(2015, 3, 20), new Date(2016, 8, 30), null, 109, null],
  ['C15', 'C15', 'Xa', new Date(2016, 5, 2), new Date(2016, 9, 31), null, 111, null],
  ['C20', 'C20', 'Xa', new Date(2016, 8, 15), new Date(2016, 10, 25), null, 88, null],
  ['C21', 'C21', 'Xa', new Date(2016, 8, 1), new Date(2016, 10, 25), null, 90, null]
  ]);

  var options = {
    width: '100%',
    hAxis: {
      textStyle: {
        fontName: ['Roboto Condensed']
      }
    },
    gantt: {
      labelStyle: {
        fontSize: 12,
        color: '#757575'
      }
    }
  };

  var container = document.getElementById('chart_div');
  var chart = new google.visualization.Gantt(container);

  // monitor activity, change bar color
  var observer = new MutationObserver(function (mutations) {
    Array.prototype.forEach.call(container.getElementsByTagName('path'), function(bar, index) {
      if (data.getValue(index, 6) > 100) {
        bar.setAttribute('fill', '#a52714');
      }
    });
  });
  observer.observe(container, {
    childList: true,
    subtree: true
  });

  chart.draw(data, options);
}

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

google.charts.load('current', {
  callback: drawChart,
  packages: ['gantt']
});

function drawChart() {
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'Task ID');
  data.addColumn('string', 'Task Name');
  data.addColumn('string', 'Resource');
  data.addColumn('date', 'Start Date');
  data.addColumn('date', 'End Date');
  data.addColumn('number', 'Duration');
  data.addColumn('number', 'Percent done');
  data.addColumn('string', 'Dependencies');

  data.addRows([
    ['C10', 'C10', 'Xa', new Date(2016, 2, 23), new Date(2016, 10, 30), null, 94.84, null],
    ['C15', 'C15', 'Xa', new Date(2016, 4, 1), new Date(2016, 11, 29), null, 82.64, null],
    ['C20', 'C20', 'Xa', new Date(2016, 7, 1), new Date(2016, 10, 25), null, 93.1, null],
    ['C25', 'C25', 'Xa', new Date(2016, 3, 11), new Date(2016, 10, 25), null, 96.49, null],
    ['C30', 'C30', 'Xa', new Date(2016, 9, 3), new Date(2017, 1, 28), null, 30.41, null],
    ['C35', 'C35', 'Xa', new Date(2016, 3, 8), new Date(2016, 5, 24), null, 113.78, null]
  ]);
  data.sort([{column: 3}]);

  var w = window,
    d = document,
    e = d.documentElement,
    g = d.getElementsByTagName('body')[0],
    xWidth = w.innerWidth || e.clientWidth || g.clientWidth,
    yHeight = w.innerHeight|| e.clientHeight|| g.clientHeight;

  var options = {
    height: 600,
    width: "100%",
    hAxis: {
      textStyle: {
        fontName: ["Roboto Condensed"]
      }
    },
    gantt: {
      labelStyle: {
      fontName: ["Roboto Condensed"],
      fontSize: 12,
      color: '#757575'
      }
    }
  };
  var container = document.getElementById('chart_div');
  var chart = new google.visualization.Gantt(container);

  // monitor activity, change bar color
  var observer = new MutationObserver(function (mutations) {
    Array.prototype.forEach.call(container.getElementsByTagName('path'), function(bar, index) {
      var barY;
      if (data.getValue(index, 6) > 100) {
        bar.setAttribute('fill', '#b71c1c');
        barY = bar.getAttribute('d').split(' ')[2];
        Array.prototype.forEach.call(container.getElementsByTagName('rect'), function(bar) {
          if (bar.getAttribute('y') === barY) {
            bar.setAttribute('fill', '#f44336');
          }
        });
      }
    });
  });
  observer.observe(container, {
    childList: true,
    subtree: true
  });

  chart.draw(data, options);
}

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