Version

5.4.3

Current Behavior

jitter.line.mov

The init echarts config:

export const initEchartsOption: EChartsOption = {
    xAxis: {
        show: false,
    },
    yAxis: {
        show: false,
    },
    series: {
        type: "line",
        showSymbol: false,
        smooth: true,
        data: [],
        lineStyle: {
            color: "#000",
            width: 3,
        },
        sampling: "none",
    },
    grid: {
        right: 0,
        top: 20,
        bottom: 20,
        left: 0,
    },
    animationDuration: 0,
    animationDurationUpdate: 500,
    animationEasing: "linear",
    animationEasingUpdate: "linear",
};

and evert 500ms I will set new options:

chartRef.current!.setOption<EChartsOption>({
    yAxis: {
        min: renderData?.minYAxis || 0,
        max: renderData?.maxYAxis || 1,
    },
    xAxis: {
        min: latestData.timestamp - liveLineHistoriesConfig.time_offset,
        max: latestData.timestamp,
    },
    series: {
        data: newData,
    },
    grid: {
        right: 100
    },
});

As can be seen, when a new point appears on the right, there are two issues:

1. The line is drawn from thick to thin.

2. After the line is drawn, it jitters and changes into a smooth curve.

Expected Behavior

looks ok