ehcarts最新版本圆环 圆环在左边,legend在右边,设置legend与圆环之间距离为48px

你可以使用 ECharts 5 中的 grid 和 graphic 组件来实现该需求。代码示例如下：

option = {
    grid: {
        left: 0,
        right: '50%',
        top: 'center',
        containLabel: true
    },
    legend: {
        orient: 'vertical',
        left: '50%',
        top: 'center',
        itemGap: 48,
        data: ['数据1', '数据2', '数据3', '数据4'],
    },
    graphic: [{
        type: 'circle',
        shape: {
            cx: '25%',
            cy: '50%',
            r: 70,
            r0: 50
        },
        left: 'center',
        top: 'center',
        style: {
            fill: '#ccc'
        }
    }, {
        type: 'text',
        style: {
            text: '圆环',
            font: '14px Microsoft YaHei'
        },
        left: '25%',
        top: 'center'
    }],
    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: '数据1'},
            {value: 310, name: '数据2'},
            {value: 234, name: '数据3'},
            {value: 135, name: '数据4'}
        ]
    }]
};

其中，grid 组件的 left 属性设置为 0，表示在左侧占据全部空间；right 属性设置为 '50%'，表示在右侧占据一半的空间；top 属性设置为 'center'，表示在垂直方向上居中对齐；containLabel 属性设置为 true，表示 grid 包含了图例，可以自动计算出图例的高度。legend 组件的 left 属性设置为 '50%'，表示在右侧占据一半的空间；itemGap 属性设置为 48，表示 legend 与圆环之间的距离为 48px。graphic 组件中的 type 为 circle，shape 中的 r 和 r0 分别表示圆环的外半径和内半径；type 为 text，style 中的 text 表示文本内容，left 和 top 分别表示文本的水平和垂直位置。