ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

javascript – 设置google.visualization.DataTable的列宽

2019-08-29 18:37:25  阅读:194  来源: 互联网

标签:javascript jquery css google-visualization


我想在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%'});
  }

期望

>’名称’列宽应为300px;
>’全职员工’栏宽应为100px;

任何建议/帮助表示赞赏.

编辑

基于该建议,这是应用的解决方案:https://jsfiddle.net/dgbh6sL0/2/

解决方法:

你可以这样做:

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

此外,您需要在“绘制”中“allowHTML”,如:

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

标签:javascript,jquery,css,google-visualization
来源: https://codeday.me/bug/20190829/1762796.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有