echart 两个柱状图重叠在一起

这两个效果如何实现啊
1 A B两个柱子 A柱数值超过B柱部分用虚线表示未超过正常显示自己的颜色

不知道你这个问题是否已经解决, 如果还没有解决的话:

这个问题的回答你可以参考下: https://ask.csdn.net/questions/670074
我还给你找了一篇非常好的博客，你可以看看是否有帮助，链接：echarts关系图配置，及超出范围处理 + a、b两个节点互相指向时线上的字重叠问题
除此之外, 这篇博客: Echarts 问题解决 —— 环状饼图默认显示第一条数据及提示框、鼠标移动上去后不突出、中间展示指定样式数字、鼠标移到扇形上显示不同颜色的数字、循环高亮显示饼图各模块的扇形；中的 2.环状饼图鼠标移动上去后不突出显示 部分也许能够解决你的问题, 你可以仔细阅读以下内容或者直接跳转源博客中阅读:
- 效果展示：鼠标移动上去之后，图表保持原样，而不是像 1 中那样突出展示
- 扇形不突出：series / hoverAnimation: false

以下回答来自chatgpt:

使用ECharts实现两个柱状图重叠在一起，其中A柱子的数值超过B柱子时，超过部分用虚线表示，未超过时正常显示自己的颜色，可以按照以下步骤实现：

1. 创建两个柱状图系列：A柱子和B柱子的数据分别绑定到两个系列上。

```javascript
option = {
    xAxis: {
        type: 'category',
        data: ['Category1', 'Category2', 'Category3']
    },
    yAxis: {
        type: 'value'
    },
    series: [{
        name: 'A',
        type: 'bar',
        data: [150, 200, 180],
        itemStyle: {
            normal: {
                color: 'blue'
            }
        }
    }, {
        name: 'B',
        type: 'bar',
        data: [100, 150, 120],
        itemStyle: {
            normal: {
                color: 'green'
            }
        }
    }]
};

计算A柱子超过B柱子的部分，并将超过部分的数据和未超过部分的数据分别提取出来。

var dataA = [150, 200, 180];
var dataB = [100, 150, 120];

var exceedData = [];
var normalData = [];

for (var i = 0; i < dataA.length; i++) {
    var exceed = dataA[i] - dataB[i];
    if (exceed > 0) {
        exceedData.push(exceed);
        normalData.push(dataB[i]);
    } else {
        exceedData.push(0);
        normalData.push(dataA[i]);
    }
}

在图表中创建两个柱状图系列：超过部分的柱子和未超过部分的柱子。

option = {
    xAxis: {
        type: 'category',
        data: ['Category1', 'Category2', 'Category3']
    },
    yAxis: {
        type: 'value'
    },
    series: [{
        name: 'Exceed',
        type: 'bar',
        data: exceedData,
        itemStyle: {
            normal: {
                color: 'transparent',
                borderColor: 'red',
                borderWidth: 1,
                borderType: 'dashed'
            }
        }
    }, {
        name: 'Normal',
        type: 'bar',
        data: normalData,
        itemStyle: {
            normal: {
                color: 'blue'
            }
        }
    }]
};

将选项设置到图表中，并在页面中显示图表。

var chart = echarts.init(document.getElementById('chart'));
chart.setOption(option);

以上代码实现了A柱子的数值超过B柱子时，超过部分用虚线表示，未超过时正常显示自己的颜色的效果。注意替换掉示例代码中的数据和图表容器ID。

如果有需求中的柱子数据是动态获取的，可以将计算超过部分和未超过部分的逻辑放在数据更新的地方，并调用chart.setOption(option)来更新图表。 ```

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^