vue中使用echarts的漏斗图改为百分比的圆柱体的具体步骤

使用 echarts 实现漏斗图改为百分比的圆柱体的步骤如下：

1. 首先，在 data 中计算每个阶段的占比（即转化率），并将其转换为百分比格式。例如：

let data = [
  { name: '访问', value: 100 },
  { name: '咨询', value: 50 },
  { name: '订单', value: 20 },
  { name: '成交', value: 10 },
].map(item => {
  item.value = (item.value / 100).toFixed(2);
  return item;
});

2. 在 option 配置项中，将 `funnel` 改为 `pictorialBar`，并设置 `symbol` 和 `symbolSize` 属性，分别表示使用图形的类型和大小。例如：

option = {
  tooltip: {
    trigger: 'item',
    formatter: '{a} <br/>{b} : {c}%'
  },
  series: [
    {
      type: 'pictorialBar',
      symbol: 'circle',
      symbolSize: 50,
      data: data
    }
  ]
};

3. 最后，根据实际需求设置其他属性，例如 `xAxis`、`yAxis`、`grid`、`label`、`color` 等。

完整的代码如下：

let data = [
  { name: '访问', value: 100 },
  { name: '咨询', value: 50 },
  { name: '订单', value: 20 },
  { name: '成交', value: 10 },
].map(item => {
  item.value = (item.value / 100).toFixed(2);
  return item;
});

option = {
  tooltip: {
    trigger: 'item',
    formatter: '{a} <br/>{b} : {c}%'
  },
  series: [
    {
      type: 'pictorialBar',
      symbol: 'circle',
      symbolSize: 50,
      data: data
    }
  ]
};

通过以上步骤，就可以将 echarts 的漏斗图改为百分比的圆柱体了。