实现echarts 两个图连个线

99 阅读1分钟

image.png

1.分开两个饼图 需要设置series为list[{},{}],并且将center中心改一下

image.png

image.png

2.将左边的饼图的其他 开始角度改一下 使其永远对着右边,也就是修改上面的startAngle

const getStartAngle = (data: Datum[], value: number) => {
   const sum = data.reduce((prev: number, cur) => prev + cur.value, 0);
   return 360 * (value / sum) * 0.5;
}

3.画的线其实是SeriesData中的markLink,data是一个数组,起点->终点 是一条线 所以重点是找到起点和终点

image.png

4.画线的方法好了 在初始化时候和切换图例时动态调用

image.png