Как отобразить заголовок в середине кольцевой диаграммы с легендой? - PullRequest
Новая
       6

Как отобразить заголовок в середине кольцевой диаграммы с легендой?

2 голосов
/ 20 января 2020

Я знаю, как отцентрировать его, используя эту опцию: 

 title: {
    text: "This is title",
    align: "center",
    verticalAlign: "middle",
  },

работает нормально, но когда есть легенда, выровненная по правому или левому краю, она не будет идеально отображаться в центре, чтобы добавить Положение топора для регулировки это нормально, но не отзывчиво. когда вы изменяете размер окна, у него будут некоторые смещения.

вот демо: https://stackblitz.com/edit/react-highchart-jjzjx118

Я попытался использовать load / redraw, чтобы настроить его, но Я не знаю, почему это не работает, когда я связываю функцию перерисовки с реагирующим компонентом, я сделаю некоторые дальнейшие действия в ней, чтобы не определить ее при создании опции.

1 Ответ

2 голосов
/ 20 января 2020

Вы можете разместить заголовок в функции обратного вызова render: 

chart: {
    events: {
        render: function() {
            var seriesElPos = this.seriesGroup.getBBox();

            this.title.attr({
                x: seriesElPos.width / 2 + seriesElPos.x
            });
        }
    }
}

Демонстрационная версия: http://jsfiddle.net/BlackLabel/6m4e8x0y/4760/

Справочник по API:

https://api.highcharts.com/class-reference/Highcharts.SVGElement#attr

https://api.highcharts.com/highcharts/chart.events.render

...