ChartJS 删除图表js图例和图表之间的空格

7y4bm7vi  于 2022-11-06  发布在  Chart.js
关注(0)|答案(1)|浏览(206)

如何删除此图表图例与图表本身之间的空格

如果我改变大小,它只是打破了图表:(。
JSF中间文件:https://jsfiddle.net/ucs8ybLg/14/
image of the space between label and diagram

图表代码

const config = { 
type: 'radar',
data: data,

  options: {
    elements: {
      line: {
        borderWidth: 2
      }
    },
    scales: {
        r: {
            suggestedMin: 0,
            suggestedMax: 10
        }
    }
  },
};

const data = {
  labels: [
    'Problemlösung',
    'Ausdauer',
    'Selbstständigkeit',
    'Zuverlässigkeit',
    'Reflexionsfähigkeit',
    'Teamwork',
    'Respektvoller Umgang',
    'Pflichtbewusstsein'
  ],

  datasets: [{
    label: 'Schüler',
    data: [10, 8, 6, 7, 5, 10, 5, 6],
    fill: true,
    backgroundColor: 'rgba(255, 99, 132, 0.2)',
    borderColor: 'rgb(255, 99, 132)',
    pointBackgroundColor: 'rgb(255, 99, 132)',
    pointBorderColor: '#fff',
    pointHoverBackgroundColor: '#fff',
    pointHoverBorderColor: 'rgb(255, 99, 132)'
  },
  {
    label: 'Lehrer',
    data: [8, 10, 7, 7, 3, 9, 8, 7],
    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)'
  }]
};

非常感谢您的帮助

mrzz3bfm

mrzz3bfm1#

您可以明确定义options.aspectRatio,以变更图表的width/height比率。

options: {
  aspectRatio: 1.5,
  ...

有关详细信息,请参阅Chart.js文档中的配置选项

相关问题