Chart JS Curved Labels in Polar Area

I am working on a web project using Chart.js to create a PolarArea chart that dynamically updates based on the selected class from a dropdown menu. I have encountered an issue where the labels are dynamic, but I need it to be static

  const subjects = {
5: ["Укр. мова", "Укр. літ.", "Заруб. літ.", "Англ. мова", "Історія", "Математика", "Природа", "ІТ", "Фізкультура", "Мистецтво"],
6: ["Укр. мова", "Укр. літ.", "Заруб. літ.", "Англ. мова", "Історія", "Математика", "Природа", "ІТ", "Географія", "Фізкультура", "Мистецтво"],
7: ["Укр. мова", "Укр. літ.", "Заруб. літ.", "Англ. мова", "Всесвіт. історія", "Історія Укр.", "Алгебра", "Геометрія", "ІТ", "Біологія", "Географія", "Фізика", "Хімія", "Здоров'я", "Мистецтво", "Фізкультура"],
8: ["Укр. мова", "Укр. літ.", "Заруб. літ.", "Англ. мова", "Всесвіт. історія", "Історія Укр.", "Алгебра", "Геометрія", "ІТ", "Біологія", "Географія", "Фізика", "Хімія", "Здоров'я", "Мистецтво", "Фізкультура"],
9: ["Укр. мова", "Укр. літ.", "Заруб. літ.", "Англ. мова", "Всесвіт. історія", "Історія Укр.", "Алгебра", "Геометрія", "ІТ", "Біологія", "Географія", "Фізика", "Хімія", "Здоров'я", "Мистецтво", "Фізкультура"],
10: ["Укр. мова", "Укр. літ.", "Заруб. літ.", "Англ. мова", "Всесвіт. історія", "Історія Укр.", "Алгебра", "Геометрія", "ІТ", "Біологія", "Географія", "Фізика", "Хімія", "Здоров'я", "Мистецтво", "Фізкультура"],
11: ["Укр. мова", "Укр. літ.", "Заруб. літ.", "Англ. мова", "Всесвіт. історія", "Історія Укр.", "Алгебра", "Геометрія", "ІТ", "Біологія", "Географія", "Фізика", "Хімія", "Здоров'я", "Мистецтво", "Фізкультура"]

};

    const data = {
        labels: [],
        datasets: [{
            data: [],
            backgroundColor: [],
            borderColor: 'rgba(54, 162, 235, 0.7)',
            borderWidth: 1
        }]
    };

    const ctx = document.getElementById('myChart').getContext('2d');
    const myChart = new Chart(ctx, {
type: 'polarArea',
data: data,
options: {
    responsive: true,
    maintainAspectRatio: false,
    
    layout: {
        padding: {
            top: 30,
            bottom: 30,
            left: 30,
            right: 30
        }
    },
    scales: {
        r: {
            min: 1, // мінімальне значення
            max: 12,
            ticks: {
                stepSize: 1, 
                color: '#000', // колір поділок
                backdropColor: 'rgba(255,255,255,0.8)', // фон під поділками
                font: {
                    size: 14 // розмір шрифту для поділок
                }
            },
            grid: {
                color: '#888', // колір сітки
                circular: true
            },
        }
    },
    plugins: {
        legend: {
            display: false
        },
        labels: {
            size: 1,
            render: 'label',
            arc: true,
            fontColor: '#000',
            position: 'outside'
        }
    }
}

});
I’ve tied everything, but nothing works