Подтвердить что ты не робот

Изменить заголовок оси HighCharts

Можно ли программно изменить название оси диаграммы HighCharts?

Я пытаюсь сделать что-то вроде этого:

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

или

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

(уже установив заголовок при инициализации графика).

4b9b3361

Ответ 1

Да, вы можете сделать это, используя следующее:

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

Ответ 2

Это можно сделать непосредственно на объекте Axis, используя setTitle. Например:

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

Смотрите эту демонстрацию JSFiddle. Подпись метода:

setTitle(Object title, [Boolean redraw])

Итак, вы можете опционально передать логическое ожидание с перерисовкой. Объект title принимает те же параметры, что и xAxis.title, что означает, что вы можете передавать стили и несколько других параметров, а также сам текст. Документация API содержит полную информацию.

Ответ 3

Я не мог заставить любой из вышеперечисленных работать, возможно, с прошлого года все изменилось... Я закончил использование:

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

и это сработало хорошо...

Ответ 4

В приведенном выше ответе есть еще одна проблема. Изображения, созданные на графике с использованием модуля экспорта, будут отображать исходное название, а не измененное. Добавьте исправленную строку:

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

Ответ 5

Я создал демо-скрипт , чтобы динамически изменить заголовок оси y. См. JSFIDDLE

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 (часть кода c, чтобы обновить заголовок оси 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" !');
    });

Подробнее см. документацию по функциям обновления Highcharts.