【问题标题】:Highcharts Gantt - how to make the horizontal rows / lanes taller?Highcharts Gantt - 如何使水平行/车道更高?
【发布时间】:2021-07-28 17:26:30
【问题描述】:

关注this question...

我正在制作里程碑比较图表,并将数据标签放在里程碑标记上方。数据标签是两行文本(首字母缩写词和日期),两行位于标记上方,它们开始溢出到上面的行中。 (顶行除外,其中标签被向下推,因此它们留在图表区域内。)

如何加宽行/通道以便数据标签适合内部并更易于阅读?

我希望这些分界线分开得更远,所以在系列数据的上方和下方有更多的空白:

我尝试使用yAxis.grid.cellHeight,但这似乎不起作用。

Reference pen.

【问题讨论】:

    标签: javascript highcharts highcharts-gantt


    【解决方案1】:

    您可以增加chart.height 以在行中腾出更多空间 然后,在系列配置对象中操作groupPadding 或/和pointPadding

    var seriesOptions = {
        groupPadding: 0,
        pointPadding: 0,
        ...
    }
    

    现场演示: http://jsfiddle.net/BlackLabel/p2h5q31y/

    API 参考: https://api.highcharts.com/highcharts/chart.height

    【讨论】:

    • 不,我不是这个意思。您在那里所做的事情使系列数据“填充车道”或“填充行”更多,而不是“使行更宽”。我不希望有色部分更大,我希望有色部分上方和下方有更多的空白。屏幕截图中的红色箭头并不表示我希望将系列数据填充到何处,而是表示“使这些分界线分开得更远”。
    • 嗨@Dylan Cristy,很抱歉造成误解。您可以增加chart.height 以在行中腾出更多空间。示例:jsfiddle.net/BlackLabel/p2h5q31y
    • 啊哈,明白了。我可以使用chart.height 使行更宽,然后使用series.pointWidth 将系列数据宽度向下 恢复到当前计算的值,并真正获得额外的空白。 (或者我猜想使用pointPaddinggroupPadding 会达到相同的结果。)编辑您的答案以包含此解决方案,以便我接受它!
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2021-11-10
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-11-09
    • 2019-07-17
    • 1970-01-01
    相关资源
    最近更新 更多