Chart.js 雷达图图例标签字体大小不起作用

황준필*_*황준필 3 html javascript chart.js

我正在使用 Chart.js。

我想让我的图表图例标签字体更大。

所以我试过这样:

var ctx = $('#skill_chart');

new Chart(ctx,{
    "type":"radar",
    "data": {
            "labels":["Crawling","Django","Ubuntu Server","Coding","Cycling","Running"],
            "datasets":[{
                    "label":"My Second Dataset",
                    "data":[28,48,40,19,96,27,100],
                    "fill":true,
                    "backgroundColor":"rgba(54, 162, 235, 0.2)",
                    "borderColor":"rgb(54, 162, 235)",
                    "pointBackgroundColor":"rgb(54, 162, 235)",
                    "pointBorderColor":"#fff",
                    "pointHoverBackgroundColor":"#fff",
                    "pointHoverBorderColor":"rgb(54, 162, 235)"}]
                },
    "options":{
        "elements":{
        "line":{
            "tension":0,
            "borderWidth":3}
            }
        },

        "legend": {
            "display": true,
            "labels": {
                "fontSize": 20,
            }
        },
    });
Run Code Online (Sandbox Code Playgroud)

但它不起作用。我该怎么办?

Rou*_*nak 7

你的legend对象在options对象之外。它需要在options对象内。以下代码将起作用:

var ctx = $('#skill_chart');

new Chart(ctx,{
    "type":"radar",
    "data": {
            "labels":["Crawling","Django","Ubuntu Server","Coding","Cycling","Running"],
            "datasets":[{
                    "label":"My Second Dataset",
                    "data":[28,48,40,19,96,27,100],
                    "fill":true,
                    "backgroundColor":"rgba(54, 162, 235, 0.2)",
                    "borderColor":"rgb(54, 162, 235)",
                    "pointBackgroundColor":"rgb(54, 162, 235)",
                    "pointBorderColor":"#fff",
                    "pointHoverBackgroundColor":"#fff",
                    "pointHoverBorderColor":"rgb(54, 162, 235)"}]
                },
    "options":{
        "elements":{
            "line":{
                "tension":0,
                "borderWidth":3
            }
        },

        "legend": {
            "display": true,
            "labels": {
                "fontSize": 20,
            }
        },
    }
});
Run Code Online (Sandbox Code Playgroud)

这是字体文档的链接:https : //www.chartjs.org/docs/latest/general/fonts.html