Chart.js：将标签的一部分加粗

Question

我想在chartJS粗体中制作标签的一部分。我一直在查看文档，但我无法找到任何方式。如果可能的话，我希望有人可以帮助我。 :)下面是我希望它如何工作的图片。 （它在photoshop中制作）

所以我想把“bar total”，“bar 1”，“bar 2”，“bar 3”和“bar 4”加粗，这样与小时的差异就更明显了。

标签在我的代码中设置如下：

labels: [["bar total", "150 hour"], ["bar 1", "70 hour"], ["bar 2", "30 hour"], ["bar 3", "40 hour"], ["bar 4", "10 hour"]],

我使用ChartJS版本2.3.0。

有任何想法吗？

Answer 1

我对chartJS不太熟悉，但我相信你可以添加以下内容：

Chart.defaults.global.defaultFontStyle = 'Bold'

要么

 options: {
    scale: {
        pointLabels :{
           fontStyle: "bold",
        }
    }
}

参考文献：1）Chart js. How to change font styles for "labels" array?

希望这可以帮助！

乔尔

Answer 2

我刚试过这个。以下链接中的任何可接受的值都应该有效

https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight

例如：

Chart.defaults.global.defaultFontStyle = '600';

Answer 3

如果您正在寻找一个带有价值处理的花式标签，并带有一些标志，粗体标签等。

           labels: {
                        render:function (args) {
                            if (args.value != 0)
                                return +(parseFloat(args.value).toFixed(2)) + "hrs";
                        },
                        fontStyle: "bold",
                        fontColor: 'black',
                        position : 'outside'
                    }

我希望这有帮助。

Answer 4

Chart.defaults.global.defaultFontColor = 'red';
let chart = new Chart(ctx, {
    type: 'line',
    data: data,
    options: {
        legend: {
            labels: {
                // This more specific font property overrides the global property
                fontColor: 'black'
            }
        }
    }
});

你可以在[http://www.chartjs.org/docs/latest/general/fonts.html][1]找到

[1]：http://www.chartjs.org/docs/latest/general/fonts.html。我希望它会对你有所帮助。