Error: <path> attribute d: Expected moveto path command ('M' or 'm'), "null"

[SeanParkTiz]

Hi guys!

I am using apexchart with Vue3-apexcharts/ Vue 3 / Typescript. If a particular series is selected console thrown error when updating chart.

Does anyone know a solution?

<template>
<apexchart type="donut" width="50%" align="center" :options="options" :series="series"></apexchart>
</template>
<script lang="ts" setup>
import { mainStore} from "@/store/";
import { storeToRefs } from "pinia";
import { ref, Ref, reactive, watchEffect } from "vue";
const store = mainStore()
const { responseModel } = storeToRefs(store);

const data: dataInterface= reactive({ success: 0, fail: 0 })
const series: Ref<Array<number>> = ref([])
const options = {
    legend: {
        show: true,
        position: 'top',
        fontSize: '16px',
        labels: {
            colors: ["#fff"]
        }
    },
    labels: ['Success', 'Fail'],
    chart: {
        dataLabels: {
            enabled: false,
        },
        responsive: [{
            breakpoint: 480,
            options: {
                chart: {
                    width: 200
                },
                legend: {
                    show: false
                }
            }
        }],
        legend: {
            position: 'right',
            offsetY: 0,
            height: 230,
        },
        tooltip: {
            enabled: true
        }
    },

}

watchEffect(() => {
    if (responseModel.value !== undefined) {
        if (responseModel.value.isSuccess== true) {
            data.success+= 1
        } else if (responseModel.value.isSuccess== false) {
            data.fail += 1
        }
    }
    series.value = [data.success, data.fail]
})
</script>