HighChart пузырьковый тип. Переполнение текста в метках данных из области plotOptions - PullRequest
0 голосов
/ 15 января 2020

вот демо: онлайн демо

enter image description here

слишком длинная для отображения метка данных, я хочу, чтобы она находилась внутри пузырь и переполненный текст отображаются как «ACDE ...»

1 Ответ

0 голосов
/ 15 января 2020

Я могу предложить два решения для этого случая.

  • установить переполнение на многоточие и установить некоторую ширину для dataLabel:

Демо: https://jsfiddle.net/BlackLabel/ye5s7m6g/1/

 plotOptions: {
    series: {
      dataLabels: {
        enabled: true,
        format: "{point.name}",
          style: {
            textOverflow: 'ellipsis',
          width: 45
        }
      }
    }
  },

API: https://api.highcharts.com/highcharts/series.bubble.dataLabels.style

  • включить функцию textPath в метках данных:

Демонстрация : https://jsfiddle.net/BlackLabel/0srgnvxd/1/

  plotOptions: {
    series: {
      dataLabels: {
        enabled: true,
        format: "{point.name}",
                textPath: {
            enabled: true
        }
      }
    }
  },

API: https://api.highcharts.com/highcharts/series.bubble.dataLabels.textPath.enabled

...