echarts 饼图怎么做，标签重叠先减分类

运营要一张各渠道销售占比图，丢过来十几个分类。直接做成饼图，标签叠成一片，图例排了三行还放不下。先砍分类，再谈样式。

echarts 饼图的核心就一个 series，type 写 pie，data 里每项给 value 和 name。占比由 value 自动算，不用自己先换算成百分比。

最小配置长什么样

const option = { tooltip: { trigger: 'item' }, legend: { top: 'bottom' }, series: [{ type: 'pie', radius: ['40%', '70%'], data: [ { value: 1048, name: '搜索引擎' }, { value: 735, name: '直接访问' }, { value: 580, name: '邮件营销' } ], label: { formatter: '{b}: {d}%' } }] };

radius 给两个值就是环形图，给一个值或者不写是实心饼。label 里的 {b} 是名称，{d} 是百分比，{c} 是数值，想要什么拼什么。legend 放底部，分类多的时候记得调 itemGap 和文字宽度。

标签重叠先减分类

分类超过 6 个，饼图就很难读，颜色也不够分。把占比小的合并成其他，或者干脆换条形图。ECharts 5 可以加 labelLayout: { hideOverlap: true }，重叠的标签会自动隐藏，但信息也少了。

小扇区拉不出引导线时，把 label 的 position 设成 outside，再用 labelLine 控制长度。不要为了显示每个 1% 的类目把图撑得很大，读者根本看不清。

颜色和交互别太花

默认配色够用，要改就统一在 color 数组里换，别一个系列一个色。emphasis 可以设置 hover 放大，selectedMode 支持点击选中，但展示型图表没必要开太多交互。tooltip 用 formatter 自定义，把数值和百分比一起显示。

什么时候别用饼图

需要比较相近数值、分类超过 6 个、要看好几期趋势，都不适合饼图，横向条形图更清楚。饼图只适合表达几块占整体多少，加起来必须是 100%。echarts 饼图配置不难，难的是克制，数据先整理干净再画。