javascript - Chartjs - 为标签雷达图添加背景颜色

标签 javascript chart.js

>>> Radar chart labels with background color

您好,我只是想请求一个选项来为 Chartjs 中的标签(单独)添加背景颜色(带有背景颜色的圆 Angular 矩形)。我可以申请任何回调来更改此设置吗?如有任何帮助,我们将致以最诚挚的问候!

这是当前代码:

let chart = new Chart('chart-0', {
  type: 'radar',
  data: radarChartData,
  options: {
    responsive: true,
    legend: {
      position: 'top',
    },
    title: {
      display: true,
      text: 'Radar Chart | Chart.js',
      fontSize: 16
    },
    scale: {
      ticks: {
        beginAtZero: true
      },
      pointLabels: {
        fontSize: 14, // fontSize is ok
        fontColor: presets.blue, // fontColor is accessible
        backgroundColor: presets.yellow //This is not working for sure!
      }
    },
    animation: {
        animateScale: true,
        animateRotate: true
    }
  }
});

最佳答案

您可以使用背景颜色。

data: {
    labels: chart_label,
    datasets: [{
        label: '# of Votes',
        data: chart_data,
        backgroundColor: [
            'rgba(255, 99, 132, 0.2)',
            'rgba(54, 162, 235, 0.2)',
            'rgba(255, 206, 86, 0.2)',
            'rgba(75, 192, 192, 0.2)',
            'rgba(153, 102, 255, 0.2)',
            'rgba(255, 159, 64, 0.2)'
        ],
        borderColor: [
            'rgba(255,99,132,1)',
            'rgba(54, 162, 235, 1)',
            'rgba(255, 206, 86, 1)',
            'rgba(75, 192, 192, 1)',
            'rgba(153, 102, 255, 1)',
            'rgba(255, 159, 64, 1)'
        ],
        borderWidth: 1
    }]
},

关于javascript - Chartjs - 为标签雷达图添加背景颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47988873/

相关文章:

javascript - JS如何实现回文

javascript - 将 FirestoreCollection 转换为数组?

javascript - 图例颜色不适用于 ChartJS 饼图中随机生成的背景颜色

javascript - 使用循环将内容添加到多个类,但每个类中只有 1 个元素接收内容

javascript - Chart.js:如何让 x 轴标签显示在条形图中的条形顶部

javascript - Chart js 2.x 使 Canvas 不可见

javascript - "Process is not defined"与react-chartjs-2 CDN

javascript - 导入外部javascript文件并在vue应用程序中全局使用函数

javascript - 编码和解码跳过字符

javascript - 控制文档在向上/向下箭头上滚动的程度