ChartJS - Круговая диаграмма - как удалить метки, которые находятся на круговой диаграмме

#angular #chart.js #chartjs-2.6.0

Вопрос:

Я использую piechart из chart.js для визуализации в моем приложении. Я использую подключаемый модуль с ним chartjs-plugin-piechart-outlabels , чтобы отображать метки как внешние сегменты круговой диаграммы.

Все работает нормально, за исключением того, что метки существуют на круговой диаграмме, чего я не хочу, поскольку я показываю метки как внешние сегменты.

Я просмотрел документацию и не смог найти решение для этого, также посмотрел несколько примеров.

 public static readonly pieChartOptions: ChartOptions = {
responsive: true,
maintainAspectRatio: false,
legend: {
  display: false
},
tooltips: {
  enabled: true
},
layout: {
  padding: {
    left: 0,
    right: 0,
    top: 70,
    bottom: 0
  }
},
plugins: {
  outlabels: {
    display: true,
    borderWidth: 2,
    lineWidth: 2,
    padding: 3,
    textAlign: 'center',
    stretch: 15,
    font: {
      resizable: true,
      minSize: 12,
      maxSize: 18
    },
    valuePrecision: 1,
    percentPrecision: 2
  }
}

};

1. Вы уверены, что не используете какие-либо другие плагины, подобные chartjs-plugin-labels ? Я спрашиваю, потому что chartjs по умолчанию не отображает эти метки

2. @yurzui аааа! мой плохой, вы правы, на него была ссылка в модуле. Я не исправлял это! Спасибо, что указали на это.

3. @user1722043 Этот плагин все еще работает? chartjs-плагин-piechart-outlabels

Ответ №1:

Вам нужно отключить образцы меток, например, так:

 options: {
  plugins: {
    datalabels: {
      display: false
    }
    outlabels: {
      display: true
    }
  }
}

Ответ №2:

@yurzui упоминал, что была ссылка на chartjs-plugin-labels , которую я пропустил, чтобы удалить. Спасибо @yurzui