Ошибка при добавлении и стилизации Angular-Google-Диаграммы

#angular #charts #google-visualization

#angular #Диаграммы #google-визуализация

Вопрос:

У меня есть угловая диаграмма Google (столбчатая):

 <google-chart
  [data]="data" 
  [columns]="dataColumns"
  [type]="chartType"
  [options]="options" >
</google-chart>
  
 chartType = "BarChart";

  options = {
    backgroundColor: 'transparent',
    colors: ['#ffa500']
  }

  dataColumns= [
    ['Name', {role: 'data'}],
    ['Data', {role: 'data'}],
    ['Color', { role: 'style'}],
    [{ role: 'annotation'}]
  ]

  data= [
    ['name1', 10, 'red', 'text'],
    ['name2', 8, 'green', 'text'],
    ['name3', 5, 'blue', 'text'],
  ];
  

Теперь я получаю это сообщение: «Все ряды на данной оси должны иметь один и тот же тип данных». Что это значит и как это исправить?

И у меня есть еще один вопрос: внутри диаграммы есть эти вертикальные линии, как мне их отключить?

Ответ №1:

чтобы удалить вертикальные линии сетки,
используйте следующие hAxis параметры…

 options = {
  hAxis: {
    gridlines: {
      count: 0
    }
  },
  backgroundColor: 'transparent',
  colors: ['#ffa500']
}
  

чтобы исправить ошибку о типе данных,

используйте следующие столбцы…

 dataColumns = ['Name', 'Data', {role: 'style'}, {role: 'annotation'}]