Javascript js行为怪异

我第一次尝试使用Charts.js， &已将响应选项作为参数之一， 然而，它的行为有点奇怪。我已经改变了字体大小 从默认的12/16到22之间的图例标签， 因此，它更容易分类，但我似乎无法更改图表（雷达）点标签的字体大小，我已经阅读了文档，但它没有做任何事情。 我的js在下面

// ::..>> React Js Script here.......................................>> Block 1..
Chart.defaults.global.defaultFontFamily = "Kaushan Script";
 // Chart.defaults.global.defaultFontSize = "19";

let ctx1 = document.getElementById('myChart').getContext('2d');
// Gradient 1.
let gradientX = ctx1.createLinearGradient(220, 345, 478, 222);
    gradientX.addColorStop(0,   'rgba(3, 252, 157, 0.4)');
    gradientX.addColorStop(0.7, 'rgba(5, 99, 132, 0.5)');
    gradientX.addColorStop(1,   'rgba(48, 33, 172, 0.6)');
// Gradient 2.
let gradientY = ctx1.createLinearGradient(220, 345, 478, 222);
    gradientY.addColorStop(0,   'rgba(3, 252, 192, 0.2)');
    gradientY.addColorStop(0.7, 'rgba(5, 244, 148, 0.3)');
    gradientY.addColorStop(1,   'rgba(48, 202, 112, 0.4)');

        let chart = new Chart(ctx1, {
            // The type of chart we want to create
            type: 'radar',

            // The data for our dataset
            data: {
                labels: [
                    'Tickets\nCreated',
                    'Current\nProjects',
                    'Bug\nBounties',
                    'Issues\nSolved',
                    'Active\nMembers',
                    'Online\nUsers',
                    'Completed\nProjects'
                    ],
                datasets: [{
                    label: 'Current Stats',
                    backgroundColor: gradientX,// 'rgba(3, 252, 157, 0.9)', // Old Color ::>> 'rgba(5, 99, 132, 0.7)',
                    borderColor: 'rgba(252, 186, 3, 0.8)',
                    data: [4, 12, 18, 2, 22, 11, 27],
                    },{
                     label: 'User',
                     backgroundColor: gradientY,// 'rgba(3, 252, 157, 0.9)',    // Old Color ::>> 'rgba(5, 99, 132, 0.7)',
                     borderColor: 'rgba(201, 8, 166, 0.8)',
                     data: [44, 9, 18, 33, 4, 2, 27],
                     }]
            },
// ::..>>   Configuration options go here...................................
            options: {
                responsive: true,
                datasetStrokeWidth : 3,
                pointDotStrokeWidth : 4,
                tooltipFillColor: "rgba(0,0,0,0.8)", // Change this.
                legend: {
                    display: true,
                    labels: {
                        fontSize: 28
                    }
                }
            },

            plugins: [{     // This Plugin is Solely for chart.js to recognise \n characters
                beforeInit: function (chart) {
                    chart.data.labels.forEach(function (e, i, a) {
                        if (/\n/.test(e)) {
                            a[i] = e.split(/\n/)
                        }
                    })
                }
            }]              // End of Plugin.........
        });

而且它反应灵敏，但有点笨拙。在大屏幕2560X1440，它看起来不错，当它缩小到手机字体大块头和图表是一个小的中间点。如果我把我的浏览器从全屏调整到手机，写的东西开始变小，然后变大，然后变小，最后在手机上的尺寸变大。是否有一种类似css的方法来设置图表的最小-最大大小。。 *或者为图例文本设置最小-最大值，因为这似乎是取代其他所有内容并使图表变小的原因

我目前没有任何媒体查询（我自己的）附加到这个包含chart.js的部分，所以我不理解它的奇怪行为。 其包含的div或section是一个使用css的正方形 计算（428.8px+2vw）；这是有反应的。高度相同，但带有“vh”

有什么建议吗