Chart.js: How do I set the fontsize fo the yaxis labels for radar graph

[robertwood62]

I can't figure out how to set the font size for each of the 'data.lables' correctly. The documentation doesn't include an example. I have a radar graph, with a single series of data but the default font (12) is too small. The Chart.default.global.defaultFontSize doesn't seem to apply to the labels around the edge of the radar graph.

[simonbrunel]

Chart.defaults.global.defaultFontSize with a s to default[s]. You should also be able to customize only the scale tick labels using {options: {scale: {ticks: {fontSize: 42}}}}

[robertwood62]

Still not working… Here is an example of what I’m seeing. Is the labels such as “Friendship” around the edges that I’m trying to resize. Even setting the defaultFontSize doesn’t seem to impact the labels on the edges.

[cid:[email protected]]

        // Define the chart options
        Chart.defaults.global.defaultFontSize = 40;
        var data = {
            labels: labels,
            pointLabels: {
                fontSize: 16
            },
            datasets:
            [
                {
                    label: '@Model.GraphTitle',
                    backgroundColor: "rgba(179,181,198,0.2)",
                    borderColor: "rgba(179,181,198,1)",
                    pointBackgroundColor: "rgba(179,181,198,1)",
                    pointBorderColor: "#fff",
                    pointHoverBackgroundColor: "#fff",
                    pointHoverBorderColor: "rgba(179,181,198,1)",
                    data: data,
                }
            ]
        };


        // Get a reference to the chart and initialize it
        var chart = $('#surveyChart');
        var finalChart = new Chart(chart, {
            type: 'radar',
            data: data,
            options: {
                scale: {
                    ticks: {
                        beginAtZero: true,
                        fontSize: 18
                    },
                    yAxies: {
                        fontSize: 18
                    },
                    xAxies: {
                        fontSize: 18
                    }
                },
                legend: {
                    fontSize: 24
                },
                radius: {
                    fontSize: 24
                }
            }
        });

From: Simon Brunel [e-mail]
Sent: April 12, 2018 3:52 AM
To: chartjs/Chart.js [e-mail]
Cc: robertwood62 [e-mail]; Author [e-mail]
Subject: Re: [chartjs/Chart.js] How do I set the fontsize fo the yaxis labels for radar graph (#5406)

Chart.defaults.global.defaultFontSizehttp://www.chartjs.org/docs/latest/configuration/#global-configuration with a s to default[s]. You should also be able to customize only the scale tick labelshttp://www.chartjs.org/docs/latest/axes/styling.html#tick-configuration using {options: {scale: {ticks: {fontSize: 42}}}}

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHubhttps://github.com/chartjs/Chart.js/issues/5406#issuecomment-380711515, or mute the threadhttps://github.com/notifications/unsubscribe-auth/ALCmNUjWfX0mEgHf-N6OD0eiFPICdHxlks5tnwe5gaJpZM4TQ7Oa.

[robertwood62]

Here is an example of what I see, the "Friendship" labels on the edge are always using a small font. This is the font I'm trying to change.

[benmccann]

Please ask questions on StackOverflow: https://stackoverflow.com/questions/tagged/chart.js

[HenryAveMedi]

Here is an example of what I see, the "Friendship" labels on the edge are always using a small font. This is the font I'm trying to change.

Hey bro, was fighting myself for hours looking for the same answer to this issue
Send in the options the following property =>

options: {
scale: {
pointLabels: { fontSize: 30 /* must be a number it translates to pixels */ }
}
}