Fatal编程技术网

Google visualization Google Visualizations上的多行标题

google-visualization

Google visualization Google Visualizations上的多行标题,google-visualization,Google Visualization,我正在尝试创建一个具有多行标题的数据表。我将在这里举例说明： | 2008 | 2009 | --------------------------------------------------------- | price | qty. | price | qty | -------------------------------------------

我正在尝试创建一个具有多行标题的数据表。我将在这里举例说明：

|               2008           |           2009          |
---------------------------------------------------------
|    price      |   qty.       |    price    |   qty     |
---------------------------------------------------------
|     93993     |  34434       |     34244   |   3434    |
.....
年份标题可以被修复，因为我不想按它排序。 在谷歌可视化中有没有一种方法可以做到这一点

更新

用JS附加它不起作用，排序完成后它将消失

$(".google-visualization-table-table").prepend("<tr class='google-visualization-table-tr-head'><td colspan='4'>something</tr>");

$（“.google可视化表格”）.prepend（“某物”）；
在Google Visualizations中似乎无法执行此操作，因此我使用了。

在表的排序行（行=0）上发生单击事件后，您是否可以预先/追加此操作

如果该选项可用，则可以禁用排序。要禁用排序，请将
'sort'：'disable'
传递给
draw（）
方法。

尝试在列标签中使用html表格，并在选项中设置allowHtml:true

这是一个示例（不是您的确切要求）。 这可能会给您一些构建它的见解

<html>
  <head>
    <script type='text/javascript' src='https://www.google.com/jsapi'></script>
    <script type='text/javascript'>
      google.load('visualization', '1', {packages:['table']});
      google.setOnLoadCallback(drawTable);
      function drawTable() {
        var data = new google.visualization.DataTable();
        data.addColumn('number', '<table align="center" width="100%"><tr><td colspan="2">Year1</td></tr> <tr><td>price</td> <td>qty</td></tr></table>');
        data.addColumn('number', '<table align="center" width="100%"><tr><td colspan="2">Year2</td></tr> <tr><td>price</td> <td>qty</td></tr></table>');
        data.addRow([{v: 1, f: '<table align="center" width="100%"><tr><td>93993</td> <td>34434</td></tr></table>'},
                     {v: 2, f: '<table align="center" width="100%"><tr><td>34244</td> <td>3434</td></tr></table>'} ]);
        data.addRow([{v: 2, f: '<table align="center" width="100%"><tr><td>93995</td> <td>34435</td></tr></table>'},
                     {v: 2, f: '<table align="center" width="100%"><tr><td>34245</td> <td>3435</td></tr></table>'} ]);
        var table = new google.visualization.Table(document.getElementById('table_div'));
        table.draw(data, {showRowNumber: true, allowHtml:true });
         }
      </script>
  </head>

  <body>
    <div id='table_div'></div>
  </body>
</html>


load（'visualization'，'1'，{packages:['table']}）；
setOnLoadCallback（drawTable）；
函数drawTable（）{
var data=new google.visualization.DataTable（）；
data.addColumn（'编号'，'第一年价格数量'）；
data.addColumn（'编号'，'第二年价格数量'）；
data.addRow（[{v:1，f:'93993 34434'}，
{v:2，f:'34244 3434'}]）；
data.addRow（[{v:2，f:'9399534435'}，
{v:2，f:'34245 3435'}]）；
var table=新的google.visualization.table（document.getElementById（'table_div'）；
table.draw（数据，{showRowNumber:true，allowHtml:true}）；
}
未尝试。可能在排序后它也会消失。我不想禁用排序，只是为了有额外的标题