博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Highcharts x轴分组显示
阅读量:6226 次
发布时间:2019-06-21

本文共 1296 字,大约阅读时间需要 4 分钟。

hot3.png

样式一: 

Highcharts.chart('container', {  chart: {    type: 'column'  },  title: {    text: ''  },  credits: {    enabled: false  },  xAxis: {    plotBands: [{      id: 'first-category',      color: '#A9CDD9',      from: -0.5,      to: 2.5    }, {      id: 'second-category',      color: '#A9D9BB',      from: 2.5,      to: 6.5    }],    categories: [{      name: 'First',      categories: ['One', 'Two', 'Three']    }, {      name: 'Second',      categories: ['Four', 'Five', 'Six', 'Seven']    }],    labels: {      rotation: 0    }  },  yAxis: {    title: {      text: ''    }  },  series: [{    data: [10, 10, 10, 10, 10, 10, 10]  }]});

3b5c0de1da7ff3b8089100c3ac6e2dd8d9d.jpg

样式二:

columnChart.chartConfig.xAxis.plotBands = [            {                from:0,                to:3,                borderColor:$rootScope.deepxray_app.color.danger,                borderWidth:1,                label:{                    text:"区域1",                }            },            {                from:3.1,                to:7,                borderColor:$rootScope.deepxray_app.color.success,                borderWidth:1,                label:{                    text:"区域1",                }            }        ]

e34b889bd36b47c1ec3d0a2e019bf743408.jpg

 

plotBands API:https://api.hcharts.cn/highcharts#xAxis.plotBands.borderWidth

转载于:https://my.oschina.net/u/2391658/blog/1925857

你可能感兴趣的文章
WhyDX9:翻写D3D红龙书中的程序
查看>>
RFC 4627 JSON
查看>>
UML类图
查看>>
Flex父子窗体相互调用
查看>>
AP_应付模组在月结的处理
查看>>
javascript如何判断访问网页的设备及是否支持触屏功能
查看>>
MFC 虚函数与消息映射区别
查看>>
每日一小练——列出全部子集
查看>>
[再寄小读者之数学篇](2014-06-23 Bernstein's inequality)
查看>>
微信公众平台开发(98) UnionID
查看>>
《CLR via C#》读书笔记 之 线程基础
查看>>
Linux中的lo回环接口详细介绍
查看>>
玩转Web之servlet(三)---一张图看懂B/S架构
查看>>
Neutron中的Service类
查看>>
MCU开发之I2C通信
查看>>
angular学习笔记(二十七)-$http(5)-使用$http构建RESTful架构
查看>>
阿里集团2015届校园招聘内推
查看>>
Android 面试精华题目总结
查看>>
SQL函数简述
查看>>
Swift 注释
查看>>