echarts 饼图title和图例还有图重叠了 该怎么调整

echarts 饼图title和图例还有图重叠了 该怎么调整?

img


我只能调整图例,但是还是和图重叠了

img


这是我的代码

drawSexCompositionChart() {
      let myChart = this.$echarts.init(document.getElementById("sexComposition"), null, {width: 400,height: 150});
      let option = {
        title: {
          text: "小区人员性别构成比例图",
        },
        legend: {
          data: ["人数"],
          top:"15%",
        },
        series: [
          {
            name: "人数",
            type: 'pie',
            data: [{
              value:null,
              name:'男'
            },{
              value:null,
              name:'女'
            }
              
            ],
          },
        ],
        
      };
      // console.log(this.residentCount)
      option.series[0].data[0].value = this.man
      option.series[0].data[1].value = this.woman

      myChart.setOption(option);
      myChart.resize();
    },


 legend: {
    top:0
  },
  series: [
    {
      radius: '50%',
    }
  ]

或者放到左边

legend: {
    orient: 'vertical',
    left: 'left'
  },

把高度设置高一点试一下

初始化的时候高度加高些:

let myChart = this.$echarts.init(document.getElementById("sexComposition"), null, {width: 400,height: 300});