echarts饼图图例换行

最新推荐文章于 2024-08-28 10:50:40 发布

小璐啊

最新推荐文章于 2024-08-28 10:50:40 发布

阅读量1k

点赞数 2

文章标签： echarts 前端 java

本文链接：https://blog.csdn.net/m0_48353529/article/details/136845861

版权

legend: {
    left: "5%",
    bottom: "10%",
    orient: 'vertical',
  },

完整代码

option = {
  tooltip: {
    trigger: 'item'
  },
  legend: {
    left: "5%",
    bottom: "10%",
    orient: 'vertical',
  },

  // legend: [
  // {
  // 	x: 'left',
  // 	left:"5%",
  // 	bottom: '90',
  // 	data: ['Search Engine']
  // },{
  // 	x: 'left',
  // 	left:"5%",
  // 	bottom: '70',
  // 	data: ['Direct']
  // },
  // {
  // 	x: 'left',
  // 	left:"5%",
  // 	bottom: '50',
  // 	data: ['Email']
  // },
  // {
  // 	x: 'left',
  // 	left:"5%",
  // 	bottom: '30',
  // 	data: ['Union Ads']
  // },
  // {
  // 	x: 'left',
  // 	left:"5%",
  // 	bottom: '10',
  // 	data: ['Video Ads']
  // },
  // ],
  series: [
    {
      name: 'Access From',
      type: 'pie',
      radius: ['40%', '70%'],
      avoidLabelOverlap: false,
      label: {
        show: false,
        position: 'center'
      },
      emphasis: {
        label: {
          show: true,
          fontSize: 40,
          fontWeight: 'bold'
        }
      },
      labelLine: {
        show: false
      },
      data: [
        { value: 1048, name: 'Search Engine' },
        { value: 735, name: 'Direct' },
        { value: 580, name: 'Email' },
        { value: 484, name: 'Union Ads' },
        { value: 300, name: 'Video Ads' }
      ]
    }
  ]
};