echart pie 怎么显示数值

要在 ECharts 饼图中显示数值，可以通过设置 `series` 中的 `label` 属性来实现。具体操作如下：

1. 在 `series` 中设置 `label` 属性。

series: [
  {
    name: '访问来源',
    type: 'pie',
    radius: ['50%', '70%'],
    label: {
      show: true, // 显示标签
      formatter: '{b}: {c} ({d}%)' // 标签内容，{b} 表示名称，{c} 表示数值，{d} 表示百分比
    },
    data: [
      {value: 335, name: '直接访问'},
      {value: 310, name: '邮件营销'},
      {value: 234, name: '联盟广告'},
      {value: 135, name: '视频广告'},
      {value: 1548, name: '搜索引擎'}
    ]
  }
]

2. 设置 `tooltip` 中的 `formatter` 属性。

tooltip: {
  trigger: 'item',
  formatter: '{a} <br/>{b}: {c} ({d}%)' // 提示框内容，{a} 表示系列名称，{b} 表示名称，{c} 表示数值，{d} 表示百分比
},

这样就可以在饼图中显示数值了。

相关问题

echart pie 引线显示数值

要在 ECharts 饼图中显示引线和数值，可以使用 ECharts 提供的 labelLine 和 label 配置项。具体的配置方式如下：

1. 设置 labelLine 的相关属性，例如：

labelLine: {
    show: true, // 显示引线
    length: 20, // 引线长度
    lineStyle: {
        color: '#999', // 引线颜色
        width: 1 // 引线宽度
    }
}

2. 设置 label 的相关属性，例如：

label: {
    show: true, // 显示数值
    position: 'outside', // 数值显示位置，可选值为：inside、outside、center
    formatter: '{b}: {c} ({d}%)', // 数值格式化，{b} 代表数据项名称，{c} 代表数据项值，{d} 代表百分比
    textStyle: {
        color: '#333', // 数值文本颜色
        fontSize: 14 // 数值文本字号
    }
}

将以上两个配置项添加到饼图的 series 中即可。完整的代码示例如下：

option = {
    series: [
        {
            type: 'pie',
            data: [
                {value: 335, name: '直接访问'},
                {value: 310, name: '邮件营销'},
                {value: 234, name: '联盟广告'},
                {value: 135, name: '视频广告'},
                {value: 1548, name: '搜索引擎'}
            ],
            labelLine: {
                show: true,
                length: 20,
                lineStyle: {
                    color: '#999',
                    width: 1
                }
            },
            label: {
                show: true,
                position: 'outside',
                formatter: '{b}: {c} ({d}%)',
                textStyle: {
                    color: '#333',
                    fontSize: 14
                }
            }
        }
    ]
};

希望这个回答能够帮助到您！

echart pie 在内部显示数值

要在 ECharts 饼图内部显示数值，可以通过设置 `series` 中的 `label` 和 `labelLine` 属性来实现。具体操作如下：

1. 在 `series` 中设置 `label` 和 `labelLine` 属性。

series: [
  {
    name: '访问来源',
    type: 'pie',
    radius: ['50%', '70%'],
    label: {
      show: true, // 显示标签
      position: 'inside', // 内部显示
      formatter: '{c}' // 标签内容，{c} 表示数值
    },
    labelLine: {
      show: false // 不显示标签引导线
    },
    data: [
      {value: 335, name: '直接访问'},
      {value: 310, name: '邮件营销'},
      {value: 234, name: '联盟广告'},
      {value: 135, name: '视频广告'},
      {value: 1548, name: '搜索引擎'}
    ]
  }
]

2. 设置 `tooltip` 中的 `formatter` 属性。

tooltip: {
  trigger: 'item',
  formatter: '{a} <br/>{b}: {c} ({d}%)' // 提示框内容，{a} 表示系列名称，{b} 表示名称，{c} 表示数值，{d} 表示百分比
},

这样就可以在饼图内部显示数值了。需要注意的是，如果数值过小，可能会被遮挡，需要调整饼图的大小和位置。