Echart 堆叠stack存在负数时画图有偏差

有个需求需要画Echarts的堆叠图，如Echars示例
https://echarts.apache.org/examples/zh/editor.html?c=area-stack。

ehcarts堆叠图需要每条折线设置相同的stack，设置data之后，后一个series会加上前面series的值。如下图所示，第一条折线的第一个数据是120，第二条折线的第一个数据是220但是画在了120+220=340的位置，第三条折线的第一个数据是150画在了120+220+150=490的位置。以此类推其他数据点都是这样

在这里插入图片描述

Echarts的堆叠规则，是正数堆叠正数，负数堆叠负数。
用Echarts的示例，将第一条折线第一个数据改为负数（-120），第二条数据就会画在220的位置了。

但是我的需求是要画在220-120=100的位置，也就是不管正负通通都是后一个series加上前面的series
在这里插入图片描述

解决方案：
①修改ehcarts的文件，注释掉部分代码，即正数和正数相加，负数和负数相加的逻辑

  // if (sum >= 0 && val > 0 || // Positive stack
  // sum <= 0 && val < 0 // Negative stack
  // ) {
      sum += val;
      stackedOver = val;
      break;
    // }

②上述方案影响范围太广了，怕改了有什么问题到时候影响到所有用Echarts的地方，所以pass掉了。最后发现一个解决方案

https://blog.csdn.net/weixin_41668951/article/details/107941352

大概讲一下思路：就是取数据负的最小值base，然后把数据往上平移base，这样数据就都变为正数了。然后y轴的刻度再往下平移base，就能实现正负数相加的堆叠图效果。

多条折线，只最下面的折线series1加base就可以了，因为后面的折线series会加上第一条折线，就已经加了base了，如果series2再加了base，堆叠出来的效果就会是series1+series2+2*base，加了两倍的base。

数学思维，ev8d多思考一下原理，应该可以画出来。加油。。。

end

原文链接：https://blog.csdn.net/m0_59354754/article/details/120020401