Question

我正在使用ng2-google-charts创建时间线图表，并且我想显示一个自定义工具提示-不太复杂，我只想根据某些条件显示一个不同的值。这是我的代码：

组件：

chartData:any =  {
    chartType: 'Timeline',
    dataTable: [
        ['Name', 'From', 'To', {role: 'tooltip'}]
    ]
}

this.chartData.dataTable.push([x.values.name, x.values.dateFrom, x.values.dateTo, item.values.organization]);

问题是工具提示显示的是Name列中的值，而不显示定义为用作工具提示的最后一列中的值。因此，在工具提示中，我希望看到item.values.organization而不是x.values.name的值（当前正在显示）。请告知我我在做什么错。谢谢！

Answer 1

对于时间线图，工具提示列需要位于特定位置。

数据表的每一行都必须包含所有五列，
行标签，条形标签，工具提示，开始和结束-依次。

请参阅以下工作片段...

MYMODULE_mail($key, &$message, $params) {}

google.charts.load('current', {
  'packages': ['timeline']
});
google.charts.setOnLoadCallback(drawChart);

function drawChart() {
  var container = document.getElementById('timeline-tooltip');
  var chart = new google.visualization.Timeline(container);
  var dataTable = new google.visualization.DataTable();

  dataTable.addColumn({
    type: 'string',
    id: 'President'
  });
  dataTable.addColumn({
    type: 'string',
    id: 'dummy bar label'
  });
  dataTable.addColumn({
    type: 'string',
    role: 'tooltip'
  });
  dataTable.addColumn({
    type: 'date',
    id: 'Start'
  });
  dataTable.addColumn({
    type: 'date',
    id: 'End'
  });
  dataTable.addRows([
    ['Washington', null, 'George', new Date(1789, 3, 29), new Date(1797, 2, 3)],
    ['Adams', null, 'John', new Date(1797, 2, 3), new Date(1801, 2, 3)],
    ['Jefferson', null, 'Thomas', new Date(1801, 2, 3), new Date(1809, 2, 3)]
  ]);

  chart.draw(dataTable);
}

ng2-google-charts没有显示正确的工具提示

1 个答案: