Chart.js ChartJs-图表区域和标签区域的宽度比例

我创建了一个甜甜圈图表，但它的数据区和标签区的宽度不是我想要的

如何增加数据（图表）区域的宽度-即60%，并按比例减少标签区域的宽度

图片链接如下

---

可能以下设置适用于您。在图表选项中将

responsive

设置为

true

和

MaintaintAspectratio

设置为

false

，并将样式设置为最大高度：300px（或多或少）；宽度：自动；在画布上

...
var config = {
  type: 'doughnutLabels',
  data: {
    ...
  },
  options: {    
    ...    
    responsive: true, //IMPORTANT        
    maintainAspectRatio: false, //IMPORTANT
    ...
    legend: {
      ...
      position: 'right',
      ...
      labels: {   
        ...  
        fontColor: '#d5d6d6',      
        fontSize: this.isMobileWidth ? 10 : 16,
        ...
      }
    },
    animation: {
      animateScale: true,
      animateRotate: true
    }        
  }
};
... 

---

谢谢…无论我做什么，甜甜圈图表看起来都不自然…相反，我只想显示标签并隐藏甜甜圈图表。可能吗？

public exposureChartOptions: ChartOptions = {
    legend: {
      position: right,
      labels: {
        fontColor: '#d5d6d6',
        fontSize: this.isMobileWidth ? 10 : 16,
      },
    },
  };


  [1]: https://i.stack.imgur.com/dsoT3.png

...
var config = {
  type: 'doughnutLabels',
  data: {
    ...
  },
  options: {    
    ...    
    responsive: true, //IMPORTANT        
    maintainAspectRatio: false, //IMPORTANT
    ...
    legend: {
      ...
      position: 'right',
      ...
      labels: {   
        ...  
        fontColor: '#d5d6d6',      
        fontSize: this.isMobileWidth ? 10 : 16,
        ...
      }
    },
    animation: {
      animateScale: true,
      animateRotate: true
    }        
  }
};
...