Изменение цвета индикатора следующей страницы Google Pie Charts

1

В диаграмме Google Pie я хочу изменить цвет индикатора в легенде, чтобы перейти к следующим результатам. Теперь это синий цвет, и я не могу изменить его, хотя я могу изменить цвет кусочков пирога (сделанный) или даже текста (не обязательно). Вот скриншот: круговая диаграмма Google. Вот код:

var options1 = {
          legend: 'none',
          pieSliceText: 'label',
          width: '85%',
          height: '85%',
          chartArea: {'width': '80%', 'height': '80%'},
          legend: {'position': 'bottom'},
          backgroundColor: {fill:'transparent'},
          pieSliceBorderColor: 'transparent',
          colors: ['#41ac89', '#2b9b38', '#b3b300', '#D9C022', '#bab673']
        };
Теги:
colors
charts
google-visualization

1 ответ

0
Лучший ответ

вы можете использовать следующие параметры...

текст: legend.pagingTextStyle
стрелки: legend.scrollArrows

например

legend: {
  position: 'bottom',

  // style paging text and arrows
  pagingTextStyle: {
    color: '#616161'
  },
  scrollArrows:{
    activeColor: '#616161',
    inactiveColor:'#e0e0e0'
  }
},

см. следующий рабочий фрагмент...

google.charts.load('current', {
  packages: ['corechart']
}).then(function () {
  var data = google.visualization.arrayToDataTable([
    ['', 'Views'],
    ['dat', 40],
    ['nom', 10],
    ['gen', 10],
    ['hid1', 2],
    ['hid2', 3]
  ]);

  var options = {
    legend: 'none',
    pieSliceText: 'label',
    width: 200,
    height: 200,
    chartArea: {'width': '80%', 'height': '80%'},
    legend: {
      position: 'bottom',

      // style paging text and arrows
      pagingTextStyle: {
        color: '#616161'
      },
      scrollArrows:{
        activeColor: '#616161',
        inactiveColor:'#e0e0e0'
      }
    },
    backgroundColor: {fill: 'transparent'},
    pieSliceBorderColor: 'transparent',
    colors: ['#41ac89', '#2b9b38', '#b3b300', '#D9C022', '#bab673']
  };

  var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
  chart.draw(data, options);
});
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>
  • 0
    Работает отлично, спасибо!
  • 0
    Спасибо, я этого не знал. Запомнит на будущее!

Ещё вопросы

Сообщество Overcoder
Наверх
Меню