echarts漏斗图的label右对齐解决方案

需求如图：

方法一：创建一个div，利用绝对定位定位到需要的位置

创建一个容器，将漏斗图和一个新div放到里面，然后将容器定位设置成relative,div的定位设为absolute。连接线用hr,重写样式。连接线宽度是一样的，所以标签能对齐。

.chartContainer {
    position: relative;
    .label {
      position: absolute;
      top: 60px;
      right: 160px;
      div {
        padding: 18px 0;
        .hori-line {
          display: inline-block;
          width: 200px; // 指定固定宽度
          border-top: solid #e0e0e0 1px;
          vertical-align: middle;
          margin-right: 2px;
        }
      }
    }
}

这个方法的缺点是间距不太准确。

方法二：利用两个漏斗图，让其中一个不显示label

option = {
    series: [
        {
            name:'漏斗图',
            type:'funnel',
            left: 0,
            top: 60,
            bottom: 60,
            width: '60%',
            min: 0,
            max: 100,
            minSize: '0%',
            maxSize: 0, // 设为 0，表示最大宽度为0，这样此层只会显示label
            //并且由于宽度为0，漏斗图是居中显示的，所以label线条的起始位置都是中间
            sort: 'descending',
            z: 1,// 控制图形的前后顺序。z值小的图形会被z值大的图形覆盖。
            gap: 2,
            label: {
                show: true,
                position: 'right'
            },
            labelLine: {
                length: 400, // label拉线的长度根据自己的场景进行设置即可
                lineStyle: {
                    width: 1,
                    type: 'solid'
                }
            },
            data: []
        },
        {
            name:'漏斗图label',
            type:'funnel',
            left: 0,
            top: 60,
            bottom: 60,
            width: '60%',
            min: 0,
            max: 100,
            minSize: '0%',
            maxSize: '100%',
            sort: 'descending',
            gap: 2,
            label: {
                show: false,
            },
            data: []
        }
    ]
};

两个漏斗图的data值是一样的。