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

338
Visualizações
ApexCharts in Vue changing options does not work

When I switch between two different charts(that both have different series and options) from ApexChart using v-if that have different chart options set there is some kind of bug that does makes the changed chart not render correctly.

  <apexchart v-if="switch1" :options="chartOptions1" :series="series1"></apexchart>
  <apexchart v-else :options="chartOptions2" :series="series2"></apexchart>

So for example I have chart options that has fill set and one without. When I switch between them both have fill (the one that didnt have takes the fill options from the other). Here is the example of this behaviour:

https://codesandbox.io/s/line-with-upper-and-lower-band-apexchart-slhbs?file=/src/components/ChartBasic.vue

Anyone has idea how to fix this?

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

0

So thanks to @pkorhone suggestion I managed to find current workaround for this matter is to use v-show instead of v-if and change the height of the other chart by a little bit so that it somehow forces the chart to rerender:

<apexchart v-show="switch1"  height="400" :options="chartOptionsBands" :series="seriesBands"></apexchart>
<apexchart v-show="!switch1" height="401" :options="chartOptions" :series="series"></apexchart>
over 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