小程序一行展示两个环形图：使用 echarts 和 `<canvas>`

在小程序上一行展示两个环形图可以使用两个 <canvas> 元素并将它们放在同一行。以下是一个示例代码：

<view class='chart-row'>
  <canvas canvas-id='chart1' class='chart'></canvas>
  <canvas canvas-id='chart2' class='chart'></canvas>
</view>

然后，在对应的小程序页面的 JS 文件中，你可以使用 <chart> 组件来绘制环形图。以下是一个示例代码：

import * as echarts from '../../components/ec-canvas/echarts';

Page({
  onReady: function () {
    this.initChart1();
    this.initChart2();
  },

  initChart1: function () {
    this.selectComponent('#chart1').init((canvas, width, height) => {
      const chart = echarts.init(canvas, null, {
        width: width,
        height: height
      });

      // 绘制环形图1的数据和配置
      const option = {
        series: [{
          type: 'pie',
          data: [{
            value: 335,
            name: '数据1'
          }, {
            value: 310,
            name: '数据2'
          }],
          radius: ['40%', '70%']
        }]
      };

      chart.setOption(option);
      return chart;
    });
  },

  initChart2: function () {
    this.selectComponent('#chart2').init((canvas, width, height) => {
      const chart = echarts.init(canvas, null, {
        width: width,
        height: height
      });

      // 绘制环形图2的数据和配置
      const option = {
        series: [{
          type: 'pie',
          data: [{
            value: 500,
            name: '数据3'
          }, {
            value: 200,
            name: '数据4'
          }],
          radius: ['40%', '70%']
        }]
      };

      chart.setOption(option);
      return chart;
    });
  }
});

在上面的示例代码中，initChart1 和 initChart2 函数分别初始化了两个 <canvas> 元素，并使用了第三方图表库 echarts 来绘制环形图。你需要根据自己的数据和配置，修改 initChart1 和 initChart2 函数中的 option 对象。

最后，你可以使用 CSS 来控制 <canvas> 元素的样式，使它们在一行中展示。以下是一个示例 CSS 代码：

.chart-row {
  display: flex;
  justify-content: space-between;
  margin-top: 20px;
}

.chart {
  width: 45%;
  height: 300px;
}

在上面的示例 CSS 代码中，.chart-row 类用于将两个 <canvas> 元素放在同一行，并使用了 flex 布局和 space-between 属性来实现它们之间的间距。.chart 类用于设置每个 <canvas> 元素的宽度和高度。

通过以上的代码，你可以在小程序上一行展示两个环形图。你可以根据自己的需求修改和调整代码。