Question

我有以下小提琴：

我遇到的问题是我希望在图表的左下角有一个副标题（或者能达到类似效果的字幕），但不要让它表现为浮动，即让图表自动调整间距在字幕高度上，与floating属性为false时标题相同的方式。传说似乎已经以这种方式工作，所以我不确定如何与副标题实现相同。

编辑：理想情况下，我希望将标题保持在原位。

Answer 1

试试这个： - http://jsfiddle.net/fggr567e/1/

<强> JS： -

$(function () {
    $('#container').highcharts({                
                "chart": {
                    "renderTo": "chart-2",
                    "type": "column",
                     //This works but I need to calculate this based on the subtitle height which is not ideal 
                     //spacingBottom: 40 
                },           
                title:{
                     verticalAlign: "bottom",
                    align: "left",
                    floating: false,                   
                    "text": ""
                },
                "subtitle": {
                    verticalAlign: "bottom",
                    align: "left",
                    floating: false,                   
                    "text": "Subtitle"
                },
                "series": [ { data: [112800, 134409] } ]
            });
});

Answer 2

I've moved my question over to the highcharts support forum and this is the response I have received:

There is no option to do that.

One way could be to place the subtitle outside the chart, under chart's container.

Other solution might be to dynamically change bottom margin after each chart.redraw event and readjust position of a custom text element created via renderer to be used instead of Highcharts' subtitle. Recalculating space need for the text will also resolve the problem with subtitle not returning to a bigger size after change of width (being increased) of chart's container.

In short there's no way to do this natively in highcharts.

In the end I did what was suggested in the first line, placed the subtitle outside the chart as HTML.

如何在非浮动标题/副标题上使用verticalAlign？

2 个答案:

试试这个： - http://jsfiddle.net/fggr567e/1/