.JS dosyası içerisine PHP - JSON entegre etmek istiyorum.

Selamlar,
X.PHP isimli bir dosyam var. Bu dosya ile veritabanına bağlanıp istemiş olduğum koşullar ile birlikte JSON formatında sayılar alıyorum.
Ekranıma almış olduğum örnek çıktı aşağıdaki gibidir;

["25","25","21","18","0"]

Y.JS isimli bir javascript dosyam var ve ben X.PHP üzerinden almış olduğum JSON formatındaki dosyaları Y.JS dosyasına entegre etmek istiyorum.
Entegre etmek istemiş olduğum bölüm "data: [15, 25, 15, 40, 20, 50]" bölümünde bulunan sayıların olduğu kısım.

Bu işlemi nasıl yapabilirim?

            function() {
                var e, t = document.querySelectorAll(".mixed-widget-13-chart");
                [].slice.call(t).map((function(t) {
                    if (e = parseInt(KTUtil.css(t, "height")), t) {
                        var a = KTUtil.getCssVariableValue("--bs-gray-800"),
                            o = KTUtil.getCssVariableValue("--bs-gray-300");
                        new ApexCharts(t, {
                            series: [{
                                name: "Net Profit",
                                data: [15, 25, 15, 40, 20, 50]
                            }],
                            grid: {
                                show: !1,
                                padding: {
                                    top: 0,
                                    bottom: 0,
                                    left: 0,
                                    right: 0
                                }
                            },
                            chart: {
                                fontFamily: "inherit",
                                type: "area",
                                height: e,
                                toolbar: {
                                    show: !1
                                },
                                zoom: {
                                    enabled: !1
                                },
                                sparkline: {
                                    enabled: !0
                                }
                            },
                            plotOptions: {},
                            legend: {
                                show: !1
                            },
                            dataLabels: {
                                enabled: !1
                            },
                            fill: {
                                type: "gradient",
                                gradient: {
                                    opacityFrom: .4,
                                    opacityTo: 0,
                                    stops: [20, 120, 120, 120]
                                }
                            },
                            stroke: {
                                curve: "smooth",
                                show: !0,
                                width: 3,
                                colors: ["#FFFFFF"]
                            },
                            xaxis: {
                                categories: ["Feb", "Mar", "Apr", "May", "Jun", "Jul"],
                                axisBorder: {
                                    show: !1
                                },
                                axisTicks: {
                                    show: !1
                                },
                                labels: {
                                    show: !1,
                                    style: {
                                        colors: a,
                                        fontSize: "12px"
                                    }
                                },
                                crosshairs: {
                                    show: !1,
                                    position: "front",
                                    stroke: {
                                        color: o,
                                        width: 1,
                                        dashArray: 3
                                    }
                                },
                                tooltip: {
                                    enabled: !0,
                                    formatter: void 0,
                                    offsetY: 0,
                                    style: {
                                        fontSize: "12px"
                                    }
                                }
                            },
                            yaxis: {
                                min: 0,
                                max: 60,
                                labels: {
                                    show: !1,
                                    style: {
                                        colors: a,
                                        fontSize: "12px"
                                    }
                                }
                            },
                            states: {
                                normal: {
                                    filter: {
                                        type: "none",
                                        value: 0
                                    }
                                },
                                hover: {
                                    filter: {
                                        type: "none",
                                        value: 0
                                    }
                                },
                                active: {
                                    allowMultipleDataPointsSelection: !1,
                                    filter: {
                                        type: "none",
                                        value: 0
                                    }
                                }
                            },
                            tooltip: {
                                style: {
                                    fontSize: "12px"
                                },
                                y: {
                                    formatter: function(e) {
                                        return "$" + e + " thousands"
                                    }
                                }
                            },
                            colors: ["#ffffff"],
                            markers: {
                                colors: [a],
                                strokeColor: [o],
                                strokeWidth: 3
                            }
                        }).render()
                    }
                }))
            }(),

Ajax kullanıp uzaktan çekmen en faydalısı olur.

Ajax kullanıp post edin.

fetch ile x sayfasına istek atın dönen veriyi data ya tanımlayın.
 örnek şu şekilde


function() {
    var e, t = document.querySelectorAll(".mixed-widget-13-chart");
    [].slice.call(t).map((async function(t) {
        if (e = parseInt(KTUtil.css(t, "height")), t) {
            var a = KTUtil.getCssVariableValue("--bs-gray-800"),
                o = KTUtil.getCssVariableValue("--bs-gray-300");
            const seriesData = await fetch("x.php").then(data => data.json());
            
            new ApexCharts(t, {
                series: [{
                    name: "Net Profit",
                    data: seriesData
                }],
                grid: {
                    show: !1,
                    padding: {
                        top: 0,
                        bottom: 0,
                        left: 0,
                        right: 0
                    }