图表js。如何更改“标签”数组的字体样式?

时间:2017-02-18 13:12:20

标签: javascript css charts chart.js

我从Chart JS库中得到了一个图表。 Screenshot

var ctx = document.getElementById("myChart");
    var data = {
    labels: ["HTML", "CSS", "JavaScript", "jQuery", "Bootstrap", "Gulp", "PHP", 'SQL', 'Git'],
    datasets: [
        {
            defaultFontColor: 'red',
            backgroundColor: "rgba(0,255,255,.4)",
            borderColor: "rgba(0,255,255,.4)",
            pointBackgroundColor: "red",
            pointBorderColor: "#fff",
            lineTension: 0,
            pointHoverBackgroundColor: "#fff",
            pointHoverBorderColor: "rgba(179,181,198,1)",
            data: [95, 99, 60, 91, 36, 95, 40, 95, 95]
            }
        ]
    };
    var myRadarChart = new Chart(ctx, {
      type: 'radar',
      data: data,
      options: {
        responsive: true,
        scale: {
            reverse: false,
            ticks: {
                // defaultFontSize: true
            }
        }
      }
    });

我需要更改带下划线标签的字体样式。我挖过文档,我尽我所能。即使是全局字体设置也没有改变标签样式,尽管它适用于其他文本。你遇到过这样的问题吗?感谢。

1 个答案:

答案 0 :(得分:4)

它隐藏得很好,但您可以在“点标签选项”

下找到它

http://www.chartjs.org/docs/#scales-radial-linear-scale

这是一个例子: https://jsfiddle.net/qvrt01jp/1/

options: {
    scale: {
        pointLabels :{
           fontStyle: "bold",
        }
    }
}
如果设置如下,

global也应该有效:

Chart.defaults.global.defaultFontStyle = 'italic'