【问题标题】:Show all labels in hAxis google chart bar在 hAxis 谷歌图表栏中显示所有标签
【发布时间】:2018-01-23 14:40:27
【问题描述】:

我正在学习如何使用 Google Charts API,更具体地说是 Material cloumn charts。 我想在 hAxis 中显示所有标签,例如 (1,2,3,4,5 [...]),但我的图表以 (5,10,15, [...]) 格式显示它们。 我尝试了this question 的建议,但没有成功。

这是我目前的图表:

这是我的代码:

desenharGrafico(data: Array<any>) {

var rows: Array<any> = [];

for (var item of data) {
  var rua = item.rua;
  var valor = item.valor;
  var valorCortado = item.valorCortado;
  var objeto = { c: [{ v: rua }, { v: valor }, { v: valorCortado }] };
  rows.push(objeto);
}

var chartData = new google.visualization.DataTable({
  cols: [
    { id: '', label: 'Rua', type: 'number' },
    { id: '', label: 'Faturado', type: 'number' },
    { id: '', label: 'Corte', type: 'number' }
  ],
  rows: rows
});

var options =
  {
    title: "Período: " + this.data1 + ' á ' + this.data2,
    hAxis: { slantedText: true, showTextEvery: 1 },
    legend: "none",

  };
var chart = new google.charts.Bar(document.getElementById('cortes-rua'));
chart.draw(chartData, google.charts.Bar.convertOptions(options));
}

【问题讨论】:

  • 是否存在替代解决方案?
  • 成功了.....

标签: javascript typescript charts google-visualization


【解决方案1】:

材料图表根本不支持许多选项,
包括slantedText & showTextEvery
见 --> Tracking Issue for Material Chart Feature Parity

另一种解决方案是在 x 轴上使用 'string'

这将导致 离散 轴与 连续

如果有足够的空间,一个离散的轴会显示所有标签...

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多