Version
ng-echarts 8.0.1
Link to Minimal Reproduction
Steps to Reproduce
import * as echarts from "echarts";
import "./styles.css";
const chart = echarts.init(document.getElementById("app"));
chart.setOption({
xAxis: {
type: "category",
data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
},
yAxis: {
type: "value"
},
series: [
{
data: [120, null, 150, 80, 70, 110, 130],
type: "line",
connectNulls: true,
showBackground: true,
backgroundStyle: {
color: "rgba(180, 180, 180, 0.2)"
},
stack: "test"
},
{
data: [120, null, 150, 80, 70, 110, 130],
type: "line",
connectNulls: true,
areaStyle: {
color: "red"
},
showBackground: true,
backgroundStyle: {
color: "rgba(180, 180, 180, 0.2)"
},
stack: "test"
}
]
});
### Current Behavior
The area color from the top value overflows to the bottom.
### Expected Behavior
The area color filling stops at the lower value-line for null values
### Environment
```markdown
- OS:
- Browser:
- Framework:
Any additional comments?
No response
4条答案
按热度按时间6mw9ycah1#
I'm also experiencing this issue in echarts@5.3.2
Preview of the area not matching the line.
Sandbox:
https://codesandbox.io/s/9up7zk?file=/index.js
afdcj2ne2#
Also affected by this bug!
sqyvllje3#
Same on 5.2.0
d6kp6zgx4#
We're experiencing the same issue