[Bug] dataZoom data shadow line does not match with serie line

[a-ivanov81]

Version

5.3.2

Link to Minimal Reproduction

No response

Steps to Reproduce

1. Goto https://echarts.apache.org/examples/en/editor.html
2. Enter code:

const data = [
  [1650508472000,0],[1650508502000,0],[1650508532000,0],[1650508565000,0],
  [1650508596000,0],[1650508606000,0],[1650508626000,0],[1650508656000,0],
  [1650508686000,0],[1650508717000,0],[1650508772000,0],[1650508803000,0],
  [1650508833000,0],[1650508863000,0],[1650508893000,0],[1650508906000,0],
  [1650508923000,0],[1650508953000,0],[1650508985000,0],[1650509019000,0],
  [1650509071000,0],[1650509101000,0],[1650509132000,0],[1650509162000,0],
  [1650509194000,0],[1650509206000,0],[1650509224000,0],[1650509256000,0],
  [1650509286000,0],[1650509318000,0],[1650509373000,0],[1650509403000,0],
  [1650509433000,0],[1650509464000,0],[1650509494000,0],[1650509506000,0],
  [1650509524000,0],[1650509554000,0],[1650509586000,0],[1650509616000,0],
  [1650509672000,0],[1650509702000,0],[1650509734000,0],[1650509763000,0],
  [1650509794000,0],[1650509806000,0],[1650509824000,0],[1650509854000,0],
  [1650509884000,0],[1650509915000,0],[1650509973000,0],[1650510004000,0],
  [1650510034000,0],[1650510064000,0],[1650510095000,0],[1650510106000,0],
  [1650510125000,0],[1650510155000,0],[1650510185000,0],[1650510216000,0],
  [1650510271000,0],[1650510301000,0],[1650510333000,0],[1650510365000,0],
  [1650510395000,0],[1650510407000,0],[1650510425000,0],[1650510456000,0],
  [1650510486000,0],[1650510498000,0],[1650510504000,0],[1650510506000,0],
  [1650510510000,0],[1650510516000,0],[1650510527000,16],[1650510534000,16],
  [1650510540000,16],[1650510542000,16],[1650510546000,16],[1650510551000,12],
  [1650510557000,11],[1650510563000,11],[1650510569000,12],[1650510575000,18],
  [1650510581000,30],[1650510592000,30],[1650510594000,30],[1650510598000,32],
  [1650510609000,32],[1650510621000,32],[1650510624000,32],[1650510626000,32],
  [1650510631000,35],[1650510637000,36],[1650510647000,36],[1650510656000,36],
  [1650510666000,28],[1650510674000,28],[1650510679000,7],[1650510685000,7],
  [1650510689000,2],[1650510700000,2],[1650510717000,2],[1650510720000,0],
  [1650510725000,0],[1650510752000,0],[1650510759000,0],[1650510760000,0],
  [1650510763000,0],[1650510779000,0],[1650510780000,0],[1650510784000,0],
  [1650510798000,13],[1650510805000,13],[1650510810000,6],[1650510816000,7],
  [1650510822000,7],[1650510825000,7],[1650510829000,0],[1650510861000,0],
  [1650510862000,0],[1650510870000,0],[1650510921000,0],[1650510951000,0],
  [1650510983000,0],[1650510985000,0],[1650511016000,0],[1650511047000,0],
  [1650511078000,0],[1650511108000,0],[1650511117000,0],[1650511138000,0],
  [1650511147000,0],[1650511152000,0],[1650511158000,0],[1650511171000,0],
  [1650511176000,0],[1650511177000,0],[1650511179000,0],[1650511184000,0],
  [1650511191000,0],[1650511197000,0],[1650511202000,0],[1650511208000,0],
  [1650511225000,0],[1650511231000,0],[1650511234000,0],[1650511249000,0],
  [1650511255000,0],[1650511260000,0],[1650511266000,0],[1650511276000,45],
  [1650511284000,41],[1650511293000,39],[1650511303000,31],[1650511314000,35],
  [1650511324000,41],[1650511333000,39],[1650511343000,26],[1650511350000,20],
  [1650511356000,14],[1650511362000,16],[1650511368000,16],[1650511373000,18],
  [1650511379000,18],[1650511384000,16],[1650511390000,23],[1650511398000,3],
  [1650511412000,1],[1650511420000,0],[1650511425000,0],[1650511441000,0],
  [1650511450000,0],[1650511473000,0],[1650511479000,0],[1650511488000,0],
  [1650511518000,0],[1650511548000,0],[1650511552000,0],[1650511589000,0],
  [1650511621000,0],[1650511655000,0],[1650511686000,0],[1650511717000,0],
  [1650511747000,0],[1650511779000,0],[1650511809000,0],[1650511841000,0],
  [1650511852000,0],[1650511882000,0],[1650511912000,0],[1650511934000,0],
  [1650511939000,0],[1650511940000,0],[1650511943000,0],[1650511973000,0],
  [1650511974000,0],[1650511979000,0],[1650511984000,19],[1650512001000,20],
  [1650512007000,20],[1650512010000,20],[1650512012000,13],[1650512018000,7],
  [1650512024000,7],[1650512029000,4],[1650512035000,2],[1650512066000,2],
  [1650512069000,6],[1650512076000,6],[1650512081000,35],[1650512088000,30],
  [1650512095000,30],[1650512100000,27],[1650512106000,33],[1650512115000,33],
  [1650512120000,0],[1650512147000,0],[1650512152000,0],[1650512153000,14],
  [1650512159000,14],[1650512164000,32],[1650512170000,32],[1650512175000,52],
  [1650512182000,54],[1650512189000,54],[1650512191000,13],[1650512197000,15],
  [1650512203000,15],[1650512208000,13],[1650512214000,13],[1650512220000,14],
  [1650512227000,15],[1650512233000,12],[1650512239000,12],[1650512244000,0],
  [1650512250000,0],[1650512281000,0],[1650512285000,0],[1650512287000,0],
  [1650512289000,0],[1650512318000,0],[1650512348000,0],[1650512378000,0],
  [1650512409000,0],[1650512439000,0],[1650512441000,0],[1650512454000,0],
  [1650512455000,0],[1650512464000,0],[1650512469000,0],[1650512475000,1],
  [1650512485000,1],[1650512487000,40],[1650512497000,64],[1650512503000,58],
  [1650512510000,47],[1650512518000,47],[1650512520000,47],[1650512522000,26],
  [1650512528000,38],[1650512537000,41],[1650512545000,34],[1650512553000,34],
  [1650512559000,5],[1650512575000,0],[1650512594000,0],[1650512598000,0],
  [1650512624000,0],[1650512625000,0],[1650512626000,0],[1650512630000,0],
  [1650512635000,15],[1650512641000,15],[1650512646000,15],[1650512651000,16],
  [1650512657000,17],[1650512663000,17],[1650512668000,17],[1650512674000,17],
  [1650512679000,18],[1650512698000,18],[1650512699000,1],[1650512716000,0],
  [1650512721000,0],[1650512746000,0],[1650512755000,0],[1650512758000,0],
  [1650512767000,0],[1650512769000,0],[1650512797000,0],[1650512798000,0],
  [1650512827000,0],[1650512857000,0],[1650512887000,0],[1650512917000,0],
  [1650512947000,0],[1650512977000,0],[1650513008000,0],[1650513041000,0],
  [1650513098000,0],[1650513099000,0],[1650513131000,0],[1650513162000,0],
  [1650513192000,0],[1650513224000,0],[1650513254000,0],[1650513285000,0],
  [1650513317000,0],[1650513348000,0],[1650513397000,0],[1650513398000,0],
  [1650513427000,0],[1650513457000,0],[1650513488000,0],[1650513518000,0],
  [1650513549000,0],[1650513579000,0],[1650513610000,0],[1650513640000,0],
  [1650513698000,0],[1650513728000,0],[1650513758000,0],[1650513788000,0],
  [1650513818000,0],[1650513848000,0],[1650513878000,0],[1650513908000,0],
  [1650513938000,0],[1650513997000,0],[1650513998000,0],[1650514027000,0],
  [1650514057000,0],[1650514088000,0],[1650514119000,0],[1650514149000,0],
  [1650514179000,0],[1650514210000,0],[1650514240000,0],[1650514297000,0],
  [1650514298000,0]
];

option = {
  xAxis: {
    type: 'time',
  },
  yAxis: {},
  dataZoom: [
    {
      type: 'inside',
    },
    {
      type: 'slider',
    }
  ],
  series: [
    {
      type: 'line',
      symbol: 'none',
      data: data,
    },
  ]
};
    
myChart.setOption(option);

3. Run

Current Behavior

Data shadow line in bottom dataZoom does not match with serie line on graph

Expected Behavior

data shadow line in dataZoom must match with serie data on graph

Environment

- OS: Any
- Browser: Chrome
- Framework: Any

Any additional comments?

No response

[andrearoota]

Hi @a-ivanov81,
this happens because the X axis of the "DataZoom" component is divided into equal parts, even if the original X axis contains non-homogeneous data

[andrearoota]

Would you like a chart like that?

[a-ivanov81]

Would you like a chart like that?

Thx, but "category" axis is not suitable for the time data.
Hope this fix will be added to new release :)

[NathanIceSea]

same problem here, especially when time type xAxis has custom min and max boundary