使用 Chart js 的饼图图例样式

Posted 2023-02-16

技术标签:

【中文标题】使用 Chart js 的饼图图例样式【英文标题】：Pie chart legend styling using Chart js 【发布时间】：2017-11-01 03:31:56 【问题描述】：

如何将图例类型从矩形框设置为圆形？饼图使用chartjs.org

【问题讨论】：

【参考方案1】：

像这样放置数据集：

datasets: [
    data: [10, 20, 30],
    backgroundColor: [
       'red',
       'orange',
       'blue'
    ],
]

【讨论】：

【参考方案2】：

您可以通过将usePointStyle 属性设置为true 在图表选项中的图例标签来完成此操作，如下所示...

options: 
   legend: 
      labels: 
         usePointStyle: true  //<-- set this
      
   ,
   ...

【讨论】：

以上是关于使用 Chart js 的饼图图例样式的主要内容，如果未能解决你的问题，请参考以下文章