echarts [Bug] When type = line and the x-axis has more than one of the same data, the linking order does not follow the order of the incoming data.

nuypyhwy  于 5个月前  发布在  Echarts
关注(0)|答案(3)|浏览(54)

Version

5.4.3

https://echarts.apache.org/examples/en/editor.html?c=line-simple&code=PYBwLglsB2AEC8sDeAoWszGAG0iAXMmuhgE4QDmFApqYQOQCGAHhAM73EC-ANMReQAmhVCVjZqAMzAMAzAFJ6fMeQoALGbHoBWRcpIAjYGEwBbBgEZdS4ugDGMMIwjQAMowPVshMKQCu1Nz6mDhGzCK2sJLUjGB-pNQRYuiCsYwAWljmRMkkAJ4AgqxsAJLQgtThWtAw1Jy5vJHoCWyYCSKNuWyMAG7UBaWmjDQdkZ0kqhpyikHEqU6ZwNkA2pGiyWB5IIlabNgQFaQ2uZIQuLQAssAVDADuMQDWAGJnYLTHyWxqwLcAImkAZTUjEEPx8_kCYi4xAAuvoJDRykkSF8wVFGNg2JDYONmEV2Mj0JttgxIKY6vp0Cx2O5PN4cp9vrcLi5aV5wQFKSimRcWGz6b4AmNZuhCsVCRgtjt6D0MQEPuhoIxyQxTAYQBwRbAseRqGxCKsxOsxMTpftoBSmtrTFgwGoOdQuYrldKegdqMBYHqybFqIJYAZGOVbgc7QqSPNGAarehlhYAGwAdgADAAmWSyeOyZMAFgsyZ4sBzADpk7JU3CY7A40m0xms8ntPGLIWS2WK06SDWU-nM9ntImW0XS-XK7lYwme_Xs_HtKnWyOO1Xu3W-wnkwXh-2x-OV734zns-WF9vOxPa_vD8n4_PYBZS8mABw73J7-tXm-F2Sl1M5l_JN9Mw_W821HM9q0nOsc0faDH1_E9RytGFhXQZCuAAbiAA

Steps to Reproduce

option = {
  tooltip: {
    trigger: 'axis'
  },
  grid: {
    left: '3%',
    right: '5%',
    bottom: '15%',
    containLabel: true
  },
  toolbox: {
    feature: {
      dataZoom: {
        yAxisIndex: 'none'
      },
      restore: {},
      saveAsImage: {}
    },
    right: '3%'
  },
  dataZoom: [
    {
      type: 'slider',
      filterMode: 'weakFilter',
      showDataShadow: true
    }
  ],
  legend: {
    show: false
  },
  xAxis: {
    type: 'time',
    axisLabel: {
      showMinLabel: true,
      showMaxLabel: true
    }
  },
  yAxis: {
    type: 'value',
    name: 'mbps'
  },
  series: [
    {
      type: 'line',
      smooth: true,
      name: 'video estimated bandwidth',
      data: [
        [1670233630410, 4.032],
        [1670233630561, 4.032],
        [1670233630571, 4.032],
        [1670233630652, 4.032],
        [1670233631600, 4.032],
        [1670233643032, 4.032],
        [1670233643062, 1.008],
        [1670233643062, 3.024],
        [1670233643062, 4.032],
        [1670234848824, 4.032]
      ]
    }
  ]
};

Current Behavior

When type = line and the x-axis has more than one of the same data, the linking order does not follow the order of the incoming data.

Expected Behavior

In my case,

series: [
    {
      type: 'line',
      smooth: true,
      name: 'video estimated bandwidth',
      data: [
        [1670233630410, 4.032],
        [1670233630561, 4.032],
        [1670233630571, 4.032],
        [1670233630652, 4.032],
        [1670233631600, 4.032],
        [1670233643032, 4.032],-------------------------------------
        [1670233643062, 1.008], ---↑ they should be connected.      ↑
        [1670233643062, 3.024],                                     ↑
        [1670233643062, 4.032], ------------------------------------↑ but they are connected
        [1670234848824, 4.032] 
      ]
    }
  ]

Environment

- OS: Macos 13.5 (22G74)
- Browser: Chrome 116.0.5845.140 (Official Build) (arm64)
- Framework: React@18

Any additional comments?

No response

9rbhqvlz

9rbhqvlz1#

FIX #19062
CLOSE #19062

does you want it to be like this:

if yes then it was happening becase of data[][0](x-axis values) has multiple same value
i changed data to :
data: [
[1, 4.032],
[2, 4.032],
[3, 4.032],
[4, 4.032],
[5, 4.032],
[6, 4.032],
[7, 1.008],
[8, 3.024],
[9, 4.032],
[10, 4.032]
]

tnkciper

tnkciper2#

Yeah, I know in this case, the chart is correct. But in my needs, there will be the same data, under this premise, the data connection order of the chart is not correct.

kmb7vmvb

kmb7vmvb3#

you can use a function to add value of same key

function sumValuesByKey(data: number[][]): number[][] {
const resultMap = new Map<number, number>();

for (const [key, value] of data) {
if (resultMap.has(key)) resultMap.set(key, resultMap.get(key)! + value);
else resultMap.set(key, value);
}

const resultArray: number[][] = [];
for (const [key, value] of resultMap) {
resultArray.push([key, value]);
}

return resultArray;
}

相关问题