Format function for y-axis title text in highcharts.js

Question

I am creating line charts with dynamic data using highcharts.js API. I need to change the title of y-axis depending upon the visible series using button. Currently I am doing this which is working fine.

                  $('#button1').click(function() {  
                         //alert("buton clicked");
                            series1.hide();
                            series3.show();
                            chart.yAxis[0].axisTitle.attr({
                               text: 'Volts (V)'
                           });

                        $('#button0').removeAttr('disabled');
                    });

Now when I download the chart ,It always shows the first y axis title I have set in the chart options, not the one i explicitly change upon click function. Is there any formtter function I can use to set title text of y-axis in charts options. I have tried doing the following

      yAxis: {            
        labels: {
        text:{
            formatter: function () {
            if(this.series=="Series 1")
                return 'Power kW';
             else 
             return 'Voltage kW';
            }            
        }
        }
    }

But It is not working.

score 1 · Accepted Answer · answered Nov 03 '16 at 11:24

Use axis.update() instead of changing svg attribute directly.

$('#button1').click(function() {  
                     //alert("buton clicked");
                        series1.hide();
                        series3.show();
                        chart.yAxis[0].update({
                          title: {
                            text: 'Volts'
                          }
                        });

                    $('#button0').removeAttr('disabled');
                });

See API DOCS - axis.update().

Thank u so much. It worked.I was updating the series but didn't think of doing this. — JEECoder, Nov 04 '16 at 06:03

Format function for y-axis title text in highcharts.js

1 Answers1