Google視覚化の複数行ヘッダー

複数の行のヘッダーを持つDataTableを作成しようとしています。私はここに例示します：私はそれでソートしたくないようGoogle視覚化の複数行ヘッダー

|    2008   |   2009   | 
--------------------------------------------------------- 
| price  | qty.  | price | qty  | 
--------------------------------------------------------- 
|  93993  | 34434  |  34244 | 3434 | 
.....

年ヘッダーを固定することができます。 Googleの視覚化でこれを行う方法はありますか？

更新

JSでそれを取り付けることは、動作しない、とソートが行われたときにそれが消えます。

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

出典

2011-01-17 Elzo Valugi

は、それは私がやったように、それはDataTablesを使用してgoogleVisualizationsで行うことはできません表示されます。

出典

2011-05-06 12:19:51

テーブルの並べ替え行（行= 0）でクリックイベントが発生した後に、その行の前に追加または追加してもらえますか？

出典

2011-11-18 03:28:13 aok98125

試していません。ソート後に消えてしまうでしょう。 –

ソートを無効にするには、そのオプションが使用可能な場合。並べ替えを無効にするには'sort': 'disable'をdraw()メソッドに渡します。

出典

2012-10-26 22:57:55 xjxy

私は並べ替えを無効にしたくない、ちょうど余分のヘッダーを持つ –

カラムラベルで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>

出典

2013-07-19 09:17:08

Google視覚化の複数行ヘッダー

答えて

関連する問題