Изменение цветов на гистограмме Google

Я использую google new Таблицы строк материалов для отображения графика с опцией chart.title и chart.subtitle, но я не могу изменить цвета. То, что я пытаюсь достичь,

http://jsfiddle.net/8pjuz38c/1/

Но самое близкое, что я получаю:

http://jsfiddle.net/8pjuz38c/5/

Почему цвета не применяются к серии?

Ответ 1

Материал barchart против barchart

Вы путаете "материальный барчер" с нормальным "бархатом". Метод, используемый для раскраски баров, - это метод, используемый для обычного бархарта. Не материальный.

Разница

Сравните строки кодов внизу.

Обычный бархат

<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1','packages':['corechart']}]}"></script>

и

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

Материал barchart

<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1.1','packages':['bar']}]}"></script>

и

 var chart = new google.charts.Bar(document.getElementById('chart_div'));

Предыдущий ответ (относится к гистограмме материала с полосками мулитипа на элемент)

Добавьте атрибут colors к объекту опции.

Пример:

var options = {
        title: 'Population of Largest U.S. Cities',
        colors: ['#b0120a', '#ffab91']
      };

Итак, код в jsFiddel, как показано выше, должен быть:

Это работает для меня в je jsFiddle. Убедитесь, что ваш код выглядит следующим образом:

google.load('visualization', '1', {packages: ['corechart', 'bar']});
google.setOnLoadCallback(drawBarColors);

function drawBarColors() {
      var data = google.visualization.arrayToDataTable([
        ['City', '2010 Population', '2000 Population'],
        ['New York City, NY', 8175000, 8008000],
        ['Los Angeles, CA', 3792000, 3694000],
        ['Chicago, IL', 2695000, 2896000],
        ['Houston, TX', 2099000, 1953000],
        ['Philadelphia, PA', 1526000, 1517000]
      ]);

      console.log(google.visualization.arrayToDataTable);

      var options = {
        title: 'Population of Largest U.S. Cities',
        chartArea: {width: '50%'},
        colors: ['#b0120a', '#ffab91'],
        hAxis: {
          title: 'Total Population',
          minValue: 0
        },
        vAxis: {
          title: 'City'
        }
      };
      var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
      chart.draw(data, options);
    }

Ответ 2

У меня та же проблема, в этом случае я думаю, что это ошибка, связанная с опцией isStacked, если для этой опции установлено значение true, гистограмма материала примет цветовую палитру в качестве градиента от первого элемента массив.

Но если вы установите для этого параметра значение false, у вас будет доступ ко всему массиву цветов. Но данные не будут сложены. colors: ['#b0120a', '#ffab91'].