apexcharts does not plot the information

Question

Someone, I have a strange error here with Apexcharts + PHP and Javascritp, although the console show that the information is coming right he does not plot, I have looked at the documentation and do not understand why. Follows the codes

I bring the php information to build JSON

$('document').ready(function () {
$.ajax({
    type: "POST",
    url: "ret_charts/bar_mixed.php",
    dataType: "json",
    success: function (data) {

        var chartDia = [];
        var chartGains = [];
        var chartLoss = [];
        var chartMedia = [];

        for (var i = 0; i < data.length; i++) {
            chartDia.push(data[i].dia);
            chartGains.push(data[i].gain);
            chartLoss.push(data[i].loss);
            chartMedia.push(data[i].media);

            console.log(chartGains[i])

        }
        chartBar(chartDia, chartGains, chartLoss, chartMedia);
    }
});

})

I mount the chart as documentation

function chartBar(dia, gains, loss, media) {

var options = {
    chart: {
        height: 300,
        width: '100%',
        type: "line",
        stacked: false,
        fontFamily: "IBM Plex Sans, sans-serif",
        foreColor: "#6780B1",

    },
    stroke: {
        width: [1, 2, 3, 4],
        curve: "smooth"
    },
    plotOptions: {
        bar: {
            columnWidth: '25%'
        }
    },
    colors: ["#28A745", "#007BFF", "#DC3545"],
    series: [{
        name: "Total de Gains",
        type: "column",
        data: [gains]
    },
    {
        name: "Média Geral",
        type: "line",
        data: [media]
    },
    {
        name: "Total de Loss",
        type: "column",
        data: [loss]
    }],
    fill: {
        opacity: [0.85, 0.25, 1, 1],
        gradient: {
            inverseColors: false,
            shade: "light",
            type: "vertical",
            opacityFrom: 0.5,
            opacityTo: 0.1,
            stops: [0, 100, 100, 100]
        }
    },
    labels: [dia],
    markers: {
        size: 0
    },
    xaxis: {
        type: "datetime",
        labels: {
            datetimeFormatter: {
                year: 'yyyy',
                month: 'MMM \'yy',
                day: 'dd MMM',
                hour: 'HH:mm'
            }
        }
    },
    yaxis: {
        min: 0
    },
    tooltip: {
        shared: true,
        intersect: false,
        x: {
            show: true,
            format: 'dd MMM yyyy',
            formatter: undefined,
        },
        y: {
            formatter: function (i) {
                if (typeof i !== "undefined") {
                    return i.toFixed(0) + ""
                }
                return i
            }
        }
    },
    legend: {
        labels: {
            useSeriesColors: true
        },
    }
};
var chart = new ApexCharts(document.querySelector("#salesBarChart"), options);
chart.render();

}

JSON information generated by PHP file

[{"dia":"04\/01\/2021","gain":0,"loss":-36.99,"media":-36.99},{"dia":"05\/01\/2021","gain":0,"loss":-23.1,"media":-23.1},{"dia":"06\/01\/2021","gain":271.41,"loss":0,"media":135.71},{"dia":"07\/01\/2021","gain":412.72,"loss":0,"media":412.72},{"dia":"08\/01\/2021","gain":210.08,"loss":0,"media":210.08},{"dia":"15\/01\/2021","gain":103.26,"loss":0,"media":103.26}]

I just don’t know why you don’t plot the information