設置google.visualization.DataTable的列寬

Question

我想更改google.visualization.DataTable中列的寬度，但是，我不知道該怎麼做。

提琴手：https://jsfiddle.net/dgbh6sL0/1/

HTML

<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1.1','packages':['table']}]}"></script> 
<div id="table_div"></div> 

JS

google.setOnLoadCallback(drawTable); 

    function drawTable() { 
    var data = new google.visualization.DataTable(); 
    data.addColumn('string', 'Name'); 
    data.addColumn('number', 'Salary'); 
    data.addColumn('boolean', 'Full Time Employee'); 
    data.addRows([ 
     ['Mike', {v: 10000, f: '$10,000'}, true], 
     ['Jim', {v:8000, f: '$8,000'}, false], 
     ['Alice', {v: 12500, f: '$12,500'}, true], 
     ['Bob', {v: 7000, f: '$7,000'}, true] 
    ]); 

    var table = new google.visualization.Table(document.getElementById('table_div')); 

    table.draw(data, {showRowNumber: true, width: '100%', height: '100%'}); 
    } 

期望

• 'Name'列的寬度應該是300px;
• 「全職員工」列寬應爲100px;

任何建議/幫助表示讚賞。

編輯

基礎上的建議，這裏是應用解決方案：https://jsfiddle.net/dgbh6sL0/2/

Answer 1

你可以做到這一點，如：

data.setProperty(0, 0, 'style', 'width:300px'); 

此外，您還需要 「allowHTML」，在「繪製「像：

table.draw(data, {showRowNumber: true, width: '100%', height: '100%',allowHtml: true}); 

Answer 2

在一個相關的說明，您還可以非常長的覆蓋瘋狂的1行的標頭，最終通過重寫了頭細胞white-space CSS：在CSS加載

table.draw(data, {showRowNumber: true, width: '100%', height: '100%', 
    allowHtml: true, cssClassNames: {headerCell: 'normal-whitespace'}}); 

然後：

.normal-whitespace { 
    white-space: normal; 
} 

例如 https://jsfiddle.net/3j10g8n9/