我使用的是Angular 为4的高视力表。
我想创建一个图表来显示这样的结果:
其中:
- GHRM和HR扫描仪是应用程序名称。
- 我们将按组显示一些数据(此处按应用程序显示)
为了达到上述效果,我尝试在highcharts中使用columnrange图表类型。
但是上面链接的结果和我的要求不一样,你可以看到上面链接的结果:
任何一个可以帮助我知道我如何可以自定义类别视图在这种情况下,以实现如第一个屏幕截图所示的结果。
我使用的是Angular 为4的高视力表。
我想创建一个图表来显示这样的结果:
其中:
为了达到上述效果,我尝试在highcharts中使用columnrange图表类型。
但是上面链接的结果和我的要求不一样,你可以看到上面链接的结果:
任何一个可以帮助我知道我如何可以自定义类别视图在这种情况下,以实现如第一个屏幕截图所示的结果。
1条答案
按热度按时间3bygqnnd1#
获得这种外观与分组类别插件将是一个相当困难的任务来完成。
另一种方法是为每组类别使用单独的x轴(在您的情况下为GHRM和HR Scanner)。
轴可以通过
left
和top
属性定位,通过height
属性调整大小。这些选项尚未文档化,但可以使用。它们接受以百分比表示的相对值(例如30%
)和以像素表示的绝对值(例如200px
)。现场演示:http://jsfiddle.net/BlackLabel/s3k3s944/
必须禁用
grouping
,以使列始终居中。pointPadding
、groupPadding
和borederWidth
强制列占据最大垂直范围。轴配置的所有其他选项可在Highcharts API中找到:https://api.highcharts.com/highcharts/