Highcharts Bar - отображение DataLabel в правом конце графика

Question

Мне нужно, чтобы dataLabels всегда отображался в правом конце гистограммы независимо от значения данных.Согласно API Highcharts, позиция dataLabel регулируется только относительно ее текущей позиции.Есть ли способ изменить положение меток данных относительно области диаграммы?

Answer 1

Вы ищете что-то подобное?

Если вы сделаете метки HTML-элементами вместо SVG-элементов ..

plotOptions: {
    bar: {
        dataLabels: {
            enabled: true,
            allowOverlap: true,
            //Labels are easier to move around if we switch from SVG to HTML:
            useHTML: true,
        }
    }
}

.. их довольно легко перемещать с помощью CSS:

.highcharts-data-labels.highcharts-bar-series {
    /* Stretch the labels container across the whole chart area: */
    right: 0;
}

.highcharts-label.highcharts-data-label,
.highcharts-label.highcharts-data-label span {
    /* Disable the default label placement.. */
    left: auto !important;
    /* ..and put them along the right side of the container */
    right: 8px;
}

https://jsfiddle.net/ncbedru8/