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

323
Visualizações
How to make fixed width for all bars in apexcharts bar column width

Since we are using dynamic data, the data length should also be dynamic. For example, if data length is 24 column width should be 35px. if data is 2 length that time also column width should be 35px.

apexchart using columnWidth in percentage so i am not able to specify exact width for all bars in all condition if there is 1 Bar, 5 Bar, 30 Bars. it is working as responsive behaviour but i want to make it fixed width for all Bars

  1. enter image description here
  2. enter image description here

I want columnWidth to fixed with 1st image size when there is 1 data also. see in 2nd graph columnWidth is showing bigger than previous. so i want fixed for all bars in all case.

Using: import ApexCharts from "react-apexcharts"; "react-apexcharts": "^1.3.6",

about 4 years ago · Santiago Trujillo
1 Respostas
Responde à pergunta

0

In ApexCharts, there is no option to give columnWidth in pixels. You can maybe try to set percentage width based on the number of categories present. It won't be 100% accurate but might just solve the purpose.

With the chart width (w), a series of data (n), and the desired column width in px (x), I can get the width in percentage with this function:

const getPercentWidth = (w, n, x) => {
  const percentWidth = Math.round((x / (w / n)) * 100)
  return `${percentWidth}%`
}

You can check this issue on their github repo for more options in future.

about 4 years ago · Santiago Trujillo Relatório
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