Question

我的数据如下

var data = google.visualization.arrayToDataTable([
  ['Date', 'A|36~Batman', 'A|37~Superman', 'A|38~Aquaman'],
  ['01/08/2018', 950, 654, 123],
  ['02/08/2018', 760, 786, 423],
  ['03/08/2018', 1121, 856, 632],
  ['04/08/2018', 842,  475, 257],
  ['05/08/2018', 948,  658, 324]
]);

在图表中绘制此图表时，我想显示在“〜”符号后（即蝙蝠侠，超人，海王）分割的标签值。在图表的OnClick事件期间，我需要在波浪号之前的值，所以我在数据中需要这些值，因为我的onclick代码如下所示

var col = chart.getSelection()[0]['column'];
var Id = data.getColumnLabel(col).substr(0, data.getColumnLabel(col).indexOf("~"));

所以要获取数据，我也需要Id值。我可以循环列并修改列标签值，但是我不知道将列标签设置为新值的代码。我要循环的代码如下

var view = new google.visualization.DataView(data);
for (var i = 0; i < view.getNumberOfColumns(); i++) {
    var ColumnName = view.getColumnLabel(i);
    var NewColumnName = ColumnName.substring(ColumnName.lastIndexOf('~'), ColumnName.length)
    // set new column name in the view
}

如何用新列名替换旧列名？

Answer 1

使用方法-> SELECT pr.BRAND, (ISNULL(Inv.TOTALSALES, 0.00) + ISNULL(Csh.TOTALSALES, 0.00)) TotalSales FROM Products pr LEFT JOIN ( SELECT PID, SUM(TOTALSALES) TOTALSALES FROM Invoice GROUP BY PID ) Inv ON Inv.PID = pr.PID LEFT JOIN ( SELECT PID, SUM(TOTALSALES) TOTALSALES FROM Cash GROUP BY PID ) Csh ON Csh.PID = pr.PID ORDER BY pr.BRAND

但是，该方法在视图上不存在，
因此您必须更改数据表上的列标签

由于视图基于数据表，
该视图也将选择新标签...

setColumnLabel

编辑

而不是使用标签存储两个值，
利用列上可用的属性。

var view = new google.visualization.DataView(data);
for (var i = 0; i < view.getNumberOfColumns(); i++) {
    var ColumnName = view.getColumnLabel(i);
    var NewColumnName = ColumnName.substring(ColumnName.lastIndexOf('~'), ColumnName.length)
    data.setColumnLabel(i, NewColumnName);
}

然后您可以使用方法-> var data = google.visualization.arrayToDataTable([ ['Date', {id: 'A|36', label: 'Batman'}, {id: 'A|37', label: 'Superman'}, {id: 'A|38', label: 'Aquaman'}], ['01/08/2018', 950, 654, 123], ['02/08/2018', 760, 786, 423], ['03/08/2018', 1121, 856, 632], ['04/08/2018', 842, 475, 257], ['05/08/2018', 948, 658, 324] ]);和getColumnId()

如果这还不够，您可以提供自己的自定义属性...

getColumnLabel()

然后使用方法-> var data = google.visualization.arrayToDataTable([ ['Date', {id: '36', label: 'Batman', p: {category: 'A'}}, {id: '37', label: 'Superman', p: {category: 'A'}}, {id: '38', label: 'Aquaman', p: {category: 'A'}}], ['01/08/2018', 950, 654, 123], ['02/08/2018', 760, 786, 423], ['03/08/2018', 1121, 856, 632], ['04/08/2018', 842, 475, 257], ['05/08/2018', 948, 658, 324] ]);

动态更改Google图表中的视图列名称

1 个答案: