Canvas 如何控制画布如果得到标签,外部标签将被隐藏

Canvas 如何控制画布如果得到标签,外部标签将被隐藏,canvas,label,Canvas,Label,我正在为我的项目使用两个开源图表包 我遇到,如果在画布维度上,外部标签将被隐藏 如何缩小画布,但尺寸保持不变 我读了docs chart.js,看起来他们无法控制它。下面将显示我的一些代码 new Chart(this.ctx, { type: 'doughnut', data: { datasets: [{ data: data, backgroundColor: bgColor, borderColor: bgColor

我正在为我的项目使用两个开源图表包

  • 我遇到,如果在画布维度上,外部标签将被隐藏

    如何缩小画布,但尺寸保持不变

    我读了docs chart.js,看起来他们无法控制它。下面将显示我的一些代码

      new Chart(this.ctx, {
      type: 'doughnut',
      data: {
        datasets: [{
            data: data,
            backgroundColor: bgColor,
            borderColor: bgColor
        }],
        labels: ['', '', ''],
      },
      options:{
        zoomOutPercentage: 20,
        legend: {
          display: false,
        },
        plugins: {
          labels: [{
            render: 'value',
            position: 'outside',
          }],
          outlabels: {
            backgroundColor: "#8C1DFF", // Background color of Label
            borderColor: "#001BFF", // Border color of Label
            borderRadius: 17, // Border radius of Label
            borderWidth: 10, // Thickness of border
            color: 'white', // Font color
            display: true,
            lineWidth: 10, // Thickness of line between chart arc and Label
            padding: 10,
            stretch: 100, // The length between chart arc and Label
            text: "%l (%p)",
            textAlign: "center"
          }
        }
      }
    });
    
    您只是错过了布局:{ 填充:135 }

    var chartss=新图表('Chart-1'{
    “类型”:“馅饼”,
    “数据”:{`在此处输入代码`
    “标签”:[“女性”、“男性”、“其他”],
    “数据集”:[{
    “数据”:[1819000、1659900、1344],
    “背景色”:[“rgba(139,0,0,1.000)”,“rgba(0,0205,1.000)”,“rgba(0128,0,1.000)”]
    } ]
    },
    “选择”:{
    “响应”:正确,
    “标题”:{
    “显示”:正确,
    “位置”:“底部”,
    “文本”:“按性别划分的图表”
    },
    “传奇”:{
    “位置”:“底部”
    },
    “MaintaintAspectRatio”:正确,
    插件:{
    传说:错,
    不法之徒:{
    文本:“%l%v”,
    颜色:“rgba(255255255,1.000)”,
    伸展:30,
    字体:{
    可调整大小:正确,
    minSize:12,
    最大尺寸:18
    }
    }
    },
    布局:{
    填充:135
    }
    }
    });