Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

132
Visualizações
Chart js data label anchor not changing

I am using chartjs-plugin-datalabels to display data labels in stacked bar chart using Chart.js

const stackedConfig = {
   type: 'bar',
   data: {
      labels: ['Manager 1', 'Manager 2', 'Manager 3', 'Manager 4', 'Manager 5'],
      datasets: [{
         label: 'DATA1',
         data: [2, 8, 3, 4, 5],
         backgroundColor: '#22242C'
      }, {
         label: 'DATA2',
         data: [1, 2, 3, 4, 5],
         backgroundColor: '#FFA755'
      }, {
         label: 'DATA3',
         data: [3, 1, 3, 4, 5],
         backgroundColor: '#B48DD3'
      }, {
         label: 'DATA4',
         data: [5, 2, 3, 4, 5],
         backgroundColor: '#6160DC'
      }, {
         label: 'DATA5',
         data: [2, 1, 3, 4, 5],
         backgroundColor: '#54C5EB'
      }, {
         label: 'DATA5',
         data: [1, 2, 3, 4, 5],
         backgroundColor: '#FF4A55'
      }],
      barPercentage: 0.5
   },
   plugins: [ChartDataLabels],
   options: {
    barPercentage: 0.5,
    plugins: {
        legend: {
            position: 'right',
            display: false,
        },
        datalabels: {
            anchor: 'center',
            align: 'center',
            color: 'white',        
            font: {
            weight: 'bold'
            },
            formatter: Math.round
        },
    },
    responsive: true,
    scales: {
      x: {
        stacked: true,
      },
      y: {
        stacked: true
      }
    }
   }
};

var stackedCtx = document.getElementById("stacked-1-canvas").getContext('2d');
new Chart(stackedCtx, stackedConfig);

Even after putting anchor: 'center' in datalabels option, the labels are anchor at start. Even if I leave out the option, the default anchor should be center, but even then its anchored to the start position.

Please help me sort this out.

about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda