uniapp echarts饼图

要在uniapp中使用echarts饼图，可以按照以下步骤进行操作：

1. 在uniapp的项目中安装echarts组件。可以在uniapp插件市场中搜索“echarts”，然后添加到项目中即可。

2. 在需要使用echarts饼图的页面中引入echarts组件，并在页面中添加一个canvas标签，用于渲染echarts图表。示例代码如下：

<template>
  <view>
    <canvas id="myChart" style="width: 100%; height: 500rpx;"></canvas>
  </view>
</template>

<script>
  import * as echarts from '@/components/ec-canvas/echarts';

  export default {
    data() {
      return {
        ec: {
          lazyLoad: true
        }
      };
    },

    onLoad() {
      this.initChart();
    },

    methods: {
      initChart() {
        this.ecComponent = this.selectComponent('#myChart').init((canvas, width, height, dpr) => {
          const chart = echarts.init(canvas, null, {
            width: width,
            height: height,
            devicePixelRatio: dpr // 设备像素比
          });

          chart.setOption(this.getOption());

          return chart;
        });
      },

      getOption() {
        return {
          title: {
            text: '某站点用户访问来源',
            subtext: '纯属虚构',
            left: 'center'
          },
          tooltip: {
            trigger: 'item',
            formatter: '{a} <br/>{b}: {c} ({d}%)'
          },
          legend: {
            orient: 'vertical',
            left: 10,
            data: ['直接访问', '邮件营销', '联盟广告', '视频广告', '搜索引擎']
          },
          series: [
            {
              name: '访问来源',
              type: 'pie',
              radius: ['50%', '70%'],
              avoidLabelOverlap: false,
              label: {
                show: false,
                position: 'center'
              },
              emphasis: {
                label: {
                  show: true,
                  fontSize: '30',
                  fontWeight: 'bold'
                }
              },
              labelLine: {
                show: false
              },
              data: [
                { value: 335, name: '直接访问' },
                { value: 310, name: '邮件营销' },
                { value: 234, name: '联盟广告' },
                { value: 135, name: '视频广告' },
                { value: 1548, name: '搜索引擎' }
              ]
            }
          ]
        };
      }
    }
  };
</script>

3. 在getOption()方法中配置echarts饼图的相关参数，如图表标题、图例、数据等。可以根据自己的需求进行配置。

4. 最后，通过调用echarts.init()方法初始化echarts实例，并将实例绑定到页面的canvas标签上，即可渲染echarts图表。

以上就是在uniapp中使用echarts饼图的简单步骤，希望对你有所帮助。