欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

echarts pie 饼图宽度

程序员文章站 2022-05-26 22:02:33
...

效果图:

echarts pie 饼图宽度

代码:

//饼图
  initPieECharts() {
    let _this = this;
    let charts: any = _this.$echarts.init(document.getElementById("mainPie"));
    charts.setOption({
      color: ["#b6e5ff", "#b2d1f3", "#00a1ff"],
      // 点击扇形 显示提示
      tooltip: {
        trigger: "item"
      },
      series: [
        {
          name: "水果",
          type: "pie",
          radius: ["35%", "60%"],
          label: {
            normal: {
              formatter: "{c}({d}%)\n{b}",
              textStyle: {
                fontWeight: "normal",
                fontSize: 12,
                color: "#178CE6"
              },
              lineHeight: 20
            }
          },
          itemStyle: {
            normal: {
              borderColor: "#ffffff",
              borderWidth: 6
            }
          },
          data: [
            {
              value: 10,
              name: "苹果"
            },
            {
              value: 30,
              name: "梨子"
            },
            {
              value: 60,
              name: "香蕉"
            }
          ]
        }
      ]
    });
  }

 

相关标签: echarts pie