Javascript 更改 HighCharts 轴标题

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5880235/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 19:20:00  来源:igfitidea点击:

Change HighCharts axis title

javascripthighcharts

提问by Tomba

Is it possible to change the axis title of a HighCharts chart programatically?

是否可以以编程方式更改 HighCharts 图表的轴标题?

I'm trying to do something like this:

我正在尝试做这样的事情:

charts.series[0].yAxis.title.text = 'new title';

or

或者

charts.yAxis[0].title.text = 'new title';

(having already set a title when the chart was initialized).

(在图表初始化时已经设置了标题)。

回答by escouser

Yes you can do this by using the following:

是的,您可以使用以下方法执行此操作:

chart.yAxis[0].axisTitle.attr({
        text: 'new title'
    });

回答by Halvor Holsten Strand

This can be done directly on the Axisobject using setTitlenow. For example:

这可以Axis使用setTitlenow直接在对象上完成。例如:

chart.yAxis[0].setTitle({ text: "Bananas" });

See this JSFiddle demonstration. The method signature is:

请参阅此 JSFiddle 演示。方法签名是:

setTitle(Object title, [Boolean redraw])

So you could optionally pass a boolean to wait with redrawing. The titleobject takes the same parameters as xAxis.titlemeaning you could pass in styles and several other options as well as the text itself. The API documentationhas the complete information.

所以你可以选择传递一个布尔值来等待重绘。该title对象采用相同的参数,xAxis.title这意味着您可以传入样式和其他几个选项以及文本本身。API 文档有完整的信息。

回答by msanteler

I couldn't get either of the above to work, perhaps things have changed since last year... I ended up using:

我无法使上述任何一项工作,也许自去年以来情况发生了变化......我最终使用了:

chart.yAxis[0].update({
                title:{
                    text: "new title"
                }
            });

and it worked nicely...

它工作得很好......

回答by Hauke

The above answer has still one problem. Images created from the plot using the export module will show the original title, not the changed one. Add the following line to fix:

上面的回答还有一个问题。使用导出模块从绘图创建的图像将显示原始标题,而不是更改后的标题。添加以下行进行修复:

chart.options.yAxis[0].title.text = 'new title';

回答by Rahul Gupta

I have created a demo fiddle to dynamically change y-axis title. Refer this JSFIDDLE

我创建了一个演示小提琴来动态更改 y 轴 title。参考这个JSFIDDLE

HTML:

HTML:

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

<input type="button" value="Change Y-axis Title to 'My text'" id="my_btn">

JS (part of thec code to update the y-axis title on a button click):

JS(在单击按钮时更新 y 轴标题的部分代码):

var chart = $('#container').highcharts();
    $('#my_btn').click(function(){
        //alert('hey');
        chart.yAxis[0].update({
            title:{
                text:"My text"
            }
        });
        alert('Y-axis title changed to "My text" !');
    });

Refer Highcharts 'update' function documentationfor further details.

有关更多详细信息,请参阅Highcharts 'update' 函数文档