微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jQuery Flot和graphTable Colors

如何使用flot插件和graphTable更改线条颜色:
$('table.statics').graphTable({series: 'columns',position : 
       'replace',height : '180px'});

但是我想改变graphTable选项中的颜色,例如:

$('table.statics').graphTable({series: 'columns',height : '180px',colors: ["#92d5ea","#666699","#be1e2d","#ee8310","#8d10ee"]});

然后,生成的flot图中的每一行都将具有该列中的相应颜色.

解决方法

在flot中,您可以指定特定系列的颜色:
//series object
{
  data: rowData,label: label,color: '#92d5ea'
}

通过graphTable插件,有两行这样的一行:

tableData[tableData.length] = { label: label,data: rowData };

这就是它创建系列对象的地方.所以你必须弄清楚那个区域的颜色,然后设置它.

编辑:如果您希望能够通过graphTable调用进行设置,则必须编辑graphTable插件添加颜色参数作为可能性.这是如何做:

//find the line after "var args = {" and add this
colors: null,

然后,而不是

tableData[tableData.length] = { label: label,data: colData };

把这个:

var series = {label: label,data: colData };
if (args.colors && args.colors[j-args.dataStart]){
    series.color = args.colors[j-args.dataStart]
}
tableData[tableData.length] = series;

注意我只展示如何处理列部分,而不是行.现在你可以这样做:

$('#table1').graphTable({series: 'columns',colors: ['red','red','blue']});

结果看起来像this(由于没有excanvas,在IE中不起作用).

原文地址:https://www.jb51.cc/jquery/178680.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐